文本字段具有值時的Javascript復選框驗證

Question

我正在嘗試下面的代碼。 基本上，我需要的是如果文本字段（出廠日期）不為空並且未選中復選框（關閉）時發出警報。 因此，如果兩者都為空，則可以提交表單，但是如果文本字段具有值，並且未選中復選框，則發出警報。 並且警報應具有“繼續”或“取消”選項。

<script>
function validate() {
    var valid = true;
    var checkbox = document.getElementById('close').value;
    var text = document.getElementById('dateshipped').value;
    if(!(checkbox || text))
        valid = confirm("Checkbox isn't checked. \n Continue?");
    return valid;
}
</script>

我的表格：

<form id="form" name="form" method="post" onsubmit="return validate();">
<input type="checkbox" name="close" id="close" value="Yes"><label for="close" class="css-label-rma" title="Close this">Close this</label>
<input type="text" name="dateshipped" id="dateshipped" class="datefield" /></label>
<input type="submit" value="submit" />
</form>

這是jsfiddle： http : //jsfiddle.net/jvvu6vo0/

Answer 1

恐怕你有幾個問題

1） onsubmit是一個表單事件，而不是一個button事件。 你應該有

<form id="form" name="form" method="post" onsubmit="return validate();">

2）函數validateSubmit不存在。 名稱ID validate

3）您的提交按鈕必須是submit類型

4）您必須使用選中的屬性而不是值

document.getElementById('close').checked;

Answer 2

1. 您需要更改按鈕的類型才能submit 。
2. 檢查何時提交表單。
3. 與該檢查一起運行validate方法。

validate功能中有一些錯誤。 您應該檢查checkbox.checked而不是checkbox.value並且應該檢查text的字符串長度。

這個小提琴應該為您工作。

 function validate() { var valid = true; var checkbox = document.getElementById('close'); var text = document.getElementById('dateshipped').value; if( ! checkbox.checked || text.length) valid = confirm("Checkbox and text are empty. \\n Continue?"); return valid; } var form = document.getElementById('form'); form.onsubmit = function(e) { if ( ! validate()) { e.preventDefault(); // This will stop the form from submitting. return false; } alert('I am submitted.'); } 

 <form id="form" name="form" method="post"> <input type="checkbox" name="close" id="close" value="Yes"><label for="close" class="css-label-rma" title="Close this">Close this</label> <input type="text" name="dateshipped" id="dateshipped" class="datefield" /></label> <input type="submit" value="submit" /> </form>