【问题标题】:Stop link action if onclick function returns false如果 onclick 函数返回 false,则停止链接操作
【发布时间】:2013-10-03 14:54:25
【问题描述】:

这是一个简单地检查是否在表单元素上选择了单选按钮的函数。

function validate_selected(element) {
    var radios = document.getElementsByName(element);
    var formValid = false;

    var i = 0;
    while (!formValid && i < radios.length) {
      if (radios[i].checked) formValid = true;
      i++;        
    }

    if (!formValid) alert("Must select one before moving on!");
    return formValid;
}

如果函数返回 false,我希望禁用此链接。现在链接显示警报,但在警报之后链接将用户转发。

<a href="#m2" data-role="button" onclick="validate_selected('owner');"><p style="font-size:<?php echo $size1.'px'; ?>;">Next</p></a>

如果函数返回 false,我希望禁用链接。

【问题讨论】:

    标签: javascript html


    【解决方案1】:

    你几乎明白了,你还需要在函数中添加'return':

    onclick="return validate_selected('owner');"
    

    还有一个小tips,加个break:

    while (!formValid && i < radios.length) {
        if (radios[i].checked){
            formValid = true; 
            break; // No need to continue any more, we've found a selected option
        }
        i++;        
    }
    

    我已将您的 onclick 从内联更改为处理事件的正确方式,并制作了一个有效的演示。只需从按钮中删除 onclick 并添加以下内容:

    document.getElementById('button').onclick =function(){ validate_selected('owner'); };
    

    http://jsfiddle.net/WX6v7/1/(在示例中添加了一些单选按钮)

    【讨论】:

    • 第二部分有点不正确,他的while循环状态为while!formValid。因此,一旦设置为 true,while 就会退出。不过,您的方法是更好的做法。
    • 仍然无法处理添加的退货!将 while 更改为:while (i
    • @matty,你说得对,我错过了那部分。休息不是它虽然
    • 你用的是什么浏览器?
    • 我明白了,在我的页面上实现它时仍然遇到问题。我已经将我的代码复制到 fiddle 并且它也可以工作,但是我正在处理的整个页面似乎没有工作。
    【解决方案2】:

    您实际上需要return 函数返回的onclick 中的值:

    onclick="return validate_selected('owner');">
    

    【讨论】:

      猜你喜欢
      • 2020-09-03
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-01-22
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多