验证表单:如果未选中单选按钮,则显示错误消息Javascript

时间:2018-06-19 21:28:13

标签: javascript forms validation checkbox

如果未选中复选框,我试图显示一条错误消息。

我的解决方案不起作用。请看下面。不确定如何检查。

<input type="radio" name="comm">Yes
<input type="radio" name="comm">No

<div id="error_message"></div>
<button id="btn">Submit</button>

document.getElementById("btn").addEventListener("click", function(event){
        event.preventDefault();
        myFunction();
    });

function myFunction() {
        var errortxt = "";
        var radios = document.getElementsByName('comm');
        for(var i = 0; i < radios.length; i++) {
            if (radios[i].checked = false) {
                errortxt = "Error text";
            } else {
                errortxt = "";
            }
        }    
    document.getElementById("error_message").innerHTML = "<p>" + errortxt + "</p>";    
    }

2 个答案:

答案 0 :(得分:0)

您犯了一个错误,但是您的思维方式很好,我确实用正确的合成音符更新了您的代码片段。

public static <T1, T2, T3, T4, T5, T6, T7, T8, T9, R> Observable<R> zip( ObservableSource<? extends T1> source1, ObservableSource<? extends T2> source2, ObservableSource<? extends T3> source3, ObservableSource<? extends T4> source4, ObservableSource<? extends T5> source5, ObservableSource<? extends T6> source6, ObservableSource<? extends T7> source7, ObservableSource<? extends T8> source8, ObservableSource<? extends T9> source9, Function9<? super T1, ? super T2, ? super T3, ? super T4, ? super T5, ? super T6, ? super T7, ? super T8, ? super T9, ? extends R> zipper) { 用于为javascript中的变量分配值。

在JavaScript中有两个用于比较值的运算符:严格等于===和“正常”(或宽大)等于==。

请参阅http://2ality.com/2011/06/javascript-equality.html

=

for(const radio of radios){
  if(!radio.checked){
    errortxt = "Error text";
    break; // this will break the loop when a radio is not checked (will save precious time !)
  }
}
document.getElementById("btn").addEventListener("click", function(event){
        event.preventDefault();
        myFunction();
    });

function myFunction() {
        var errortxt = "";
        var radios = document.getElementsByName('comm');
        for(const radio of radios){
          if(!radio.checked){
            errortxt = "Error text";
            break;
          }
        }
    document.getElementById("error_message").innerHTML = "<p>" + errortxt + "</p>";    
    }

答案 1 :(得分:0)

只需在 HTML 中使用 required 即可解决此问题

像这样:

<input type="radio" name="comm" required>