我有一个使用 jquery 克隆的表单。由于是克隆的,所以验证无法正常进行。
我已经设法让它在未填写字段时发出警报,但在清除警报消息后它仍然提交表单。
有什么想法吗?
下面的代码...
$(document).ready(function(){
$("ul > li > a").click(function() {
$popupCopy = $("." + $(this).attr("href")).html();
$popupAddClass = $(this).attr("href");
$popupWidth = parseFloat($("." + $(this).attr("href")).attr("title")) + 80;
$("<div class='popupContainer'><div class='popupContent " + $popupAddClass + "'>" + $popupCopy + "</div><img src='images/close.png' class='closePopup'></div>").appendTo("body");
$(".popupContainer").fadeIn(500);
return false;
});
$(".giftName").live("focus", function() {
if ( $(this).val()=="Name") {
$(this).val('');
};
});
$(".giftName").live("blur", function() {
if ( $(this).val()=="") {
$(this).val('Name');
};
});
$('.giftSubmit').live('click', function(){
if( ! checkvalid() ) {
alert('Need to fill-out all fields')
}
else {
alert('Thanks')
}
});
});
function checkvalid(){
var valid = true;
$('.giftName').each(function(){
if (this.value == '' || this.value == 'Name' || this.value == null) {
valid = false;
return;
}
})
return valid;
}
正文:
<div class="pageContainer">
<div class="bodyPanel">
<ul>
<li><a href="giftlist">Gift list</a></li>
</ul>
</div>
</div>
<div class="popupsHidden">
<div class="giftlist">
<form action="sendGift.php" class="giftForm" method="post">
<input name="giftName" class="giftName" type="text" value="Name" />
<input name="" class="giftSubmit" type="submit" value="Send your promised gift..." />
</form>
</div>
</div>
最佳答案
不要监听提交按钮上的 click
事件,而是尝试列出表单本身的 submit
事件:
$('.giftForm').live('submit', function() {
if ( ! checkValid() ) {
alert('not valid !');
return false;
}
});
关于javascript - 对克隆表单进行验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7289861/