我有一个URL的提交表单,我希望它有特定的行为,我目前无法实现。最初,我希望启用该按钮。当有人输入URL并点击"提交"按钮后,我想调用我的checkURL()函数。如果函数返回true,我希望按钮被禁用,然后打开remote_file.php。如果它返回false,我希望按钮被启用,并让他们尝试另一个URL。
<form name=URLSubmitForm
action="remote_file.php"
method="post">
<input type="hidden" name="MAX_FILE_SIZE" value="524288000">
<input type="text" name="name" size="50">
<input type="submit"
onchange="this.disabled=false"
onclick="this.disabled=true; checkURL();"
value="submit">
</form>
编辑:看起来我只是把onchange放在了错误的地方。我最终这样做是为了修复重新启用按钮
<input type="text" onchange="submit.disabled=false" name="name" size="50">
谢谢!
我建议您将事件处理代码附加到表单的onsubmit事件,而不是按钮事件。您要控制的是表单是否被发布。当您的验证逻辑运行时,按钮被禁用是次要目标。
试试这个:
<script type="text/javascript">
function checkURL(){
var submitButton = document.getElementById('submitButton');
submitButton.disabled=true;
/* implement your validation logic here
if( url is invalid ){
submitButton.disabled=false;
return false;
}
*/
// everything is valid, allow form to submit
return true;
}
</script>
<form name="URLSubmitForm" action="remote_file.php" onsubmit="return checkURL();" method="post">
<input type="hidden" name="MAX_FILE_SIZE" value="524288000">
<input type="text" name="name" size="50">
<input type="submit" name="submitButton" id="submitButton" value="submit">
</form>
<input type="submit"
onclick="if (checkURL()) { this.disabled='disabled'; return true; } else { return false; }"
value="submit">
在表单的onsubmit事件中:
<form onsubmit="(function(){
if(checkURL()){
this.elements['submit'].disabled = 'disabled';
}
else{
return false;
}
})()">
由于您没有给出任何ajax代码,表单仍然会正常提交,当页面重新加载时,按钮将再次启用
onclick="checkURL(this);"
function checkURL(arg){
this.disabled=true;
if(<something>) this.disabled=false;
}