在不重新加载页面的情况下清除值

我有一系列文本框和下拉列表，用户填充它们，点击“生成”，然后连接文本框中的字符串并在页面上显示结果值。在不重新加载页面的情况下清除值

我遇到的麻烦是清除这些“输出”，如果用户再次点击生成。例如，如果有人更改文字或类似的东西。

多行上有多组文本框，生成的字符串放在页面末尾的<span>中。下面的示例代码：

HTML：

<div id="activitytag"> 
     <h3>Activity Tags</h3> 
     <a class="addActivityTag button blue">+</a> <a class="removeActivityTag button blue">-</a> 

    <form id="tag-form" class="tag-form"> 
    <input type="checkbox" class="checkbox nounderscore" name="tfcheck"> 
    <select class="page_type" title="Page Type"> 
     <option value="HPG">HPG – Homepage</option> 
     <option value="LPG">LPG – Landing Page</option> 
     <option value="CNT">CNT – Content</option> 
     <option value="RES">RES – Research</option> 
     <option value="ENG">ENG – Engagement</option> 
     <option value="CNV">CNV – Sale Conversion</option> 
    </select> 
    <input type="text" class="pagedesc nounderscore" value="Page Description" title="Page Description" onfocus="clickclear(this, 'Page Description')" onblur="clickrecall(this,'Page Description')" /> 
    <input type="text" class="tagstartdate numberinput" value="Tag Start Date" title="Tag Start Date" maxlength="8" onfocus="clickclear(this, 'Tag Start Date')" onblur="clickrecall(this,'Tag Start Date')" /> 
    <span class="tag_span"></span> 
    </form> 
</div> 

<div class="dfanames"> 
    <h4>Activity Group</h4> 
    <span id="activitytaggrouptext"></span> 
</div>

的jQuery：

$(document).ready(function() { 
    $('.gp').click(generateOutputs); 
}); 

function clearAll() { 
    $('.tag_span').each(function() { 
     $('.tag_span').html(""); 
    }); 
}

您可以从jQuery见上面我试图用each()功能（因为可能有多个行）清除跨度，但这是行不通的。希望我在这篇文章中有道理。如果人们不明白这一点，会尝试更好地解释它。

感谢

来源

2012-05-02 zik

？ – Luke

@Luke是的请！ – zik

尝试使用复位按钮

 <input type="reset"/>

否则，如果你想做到这一点的代码，你可以这样做：

function clear_form_elements(ele) { 

    $(ele).find(':input').each(function() { 
     switch(this.type) { 
      case 'password': 
      case 'select-multiple': 
      case 'select-one': 
      case 'text': 
      case 'textarea': 
       $(this).val(''); 
       break; 
      case 'checkbox': 
      case 'radio': 
       this.checked = false; 
     } 
    }); 

} 


clear_form_elements('#tag-form');

http://www.electrictoolbox.com/jquery-clear-form/

来源

2012-05-02 15:05:28

我已经有一个重置按钮（但我已经使用了'window.location.reload（）'。我希望能够清除内容并再次运行“generateOutputs”功能 – zik

请查看'函数clear_form_elements（）'代码 –

完美，谢谢。 – zik

以下是我想出的：http://jsfiddle.net/Y2JRJ/

您需要参考$(this)而不是再次引用tag_span。

$('.tag_span').each(function() { 
    $(this).html(""); 
});

来源

2012-05-02 15:11:34

如果也不会有多.tag_span当时只是做

$('.tag_span').empty()

，消除东西里面的元素，但不会从DOM

来源

2012-05-02 15:18:08 Luke

删除元素试试这个.. 。我在这里做的是将按钮的输入放在表单中，并将其设置为重置类型。这允许我将代码放在表单的onreset属性中，以便它将清除当前表单（包含按钮）的跨度。

HTML

<div id="activitytag"> 
     <h3>Activity Tags</h3> 
     <a class="addActivityTag button blue">+</a> <a class="removeActivityTag button blue">-</a> 

    <form id="tag-form" class="tag-form" onreset="clearAll()"> 
    <input type="checkbox" class="checkbox nounderscore" name="tfcheck"> 
    <select class="page_type" title="Page Type"> 
     <option value="HPG">HPG – Homepage</option> 
     <option value="LPG">LPG – Landing Page</option> 
     <option value="CNT">CNT – Content</option> 
     <option value="RES">RES – Research</option> 
     <option value="ENG">ENG – Engagement</option> 
     <option value="CNV">CNV – Sale Conversion</option> 
    </select> 
    <input type="text" class="pagedesc nounderscore" value="Page Description" title="Page Description" onfocus="clickclear(this, 'Page Description')" onblur="clickrecall(this,'Page Description')" /> 
    <input type="text" class="tagstartdate numberinput" value="Tag Start Date" title="Tag Start Date" maxlength="8" onfocus="clickclear(this, 'Tag Start Date')" onblur="clickrecall(this,'Tag Start Date')" /> 
    <span class="tag_span">123</span> 
    <input type="reset" value="ClearButton" /> 
    </form> 
</div> 

<div class="dfanames"> 
    <h4>Activity Group</h4> 
    <span id="activitytaggrouptext"></span> 
</div>

的JavaScript

function clearAll() { 
    $(".tag_span").each(function(index,element) { 
     element.innerHTML=""; 
    }); 
}

看到一个活生生的例子：要清除所有数据的跨度 “tag_span” http://jsfiddle.net/VF2qG/2/

来源

2012-05-02 15:32:36 Eric

在不重新加载页面的情况下清除值

回答

相关问题