我有一系列文本框和下拉菜单,用户填写这些内容,点击“生成”,然后连接文本框中的字符串并在页面上显示结果值。
如果用户再次点击“生成”,我遇到的问题是清除这些“输出”。例如,如果有人更改文本或类似的内容。
多行上有多组文本框,生成的字符串放置在 <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()
函数(因为可以有多行)来清除跨度,但这不起作用。希望我在这篇文章中说得有道理。如果人们不明白这一点,我会尝试更好地解释它。
谢谢
最佳答案
尝试使用重置按钮
<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');
关于javascript - 清除值而不重新加载页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10416396/