【问题标题】:jquery enable disable link based on checkboxjquery根据复选框启用禁用链接
【发布时间】:2012-11-06 07:39:14
【问题描述】:

我需要根据选中的复选框禁用/启用“a.href”链接。我有一个复选框列表(2 列)。 When at least one checkbox in a column "install" is checked, "Install" link should be enabled, otherwise disabled.当“删除”列中至少有一个复选框被选中时,应启用具有相同类名的链接,否则禁用。

我试过了,但不确定这是否正确,它不起作用:

function refleshCheckboxes() {
    if ($("input:checked").length > 0) {
        $("input:checked").each(function(index, e) {
            var css = $(e).attr('class').split(' ').slice(-1);
            $("div.markActions a").each(function (index, e) {
                $(e).removeClass("disablelink").hasClass(css);
            });

        });
    }
    else {
        $("div.markActions a").addClass("disablelink");
    }
}

$("div.markActions") - 这是 a.href 链接所在的位置(在此 div 内)

复选框与 a.href 链接具有相同的类名。所以我想获取复选框的类名并将该类与 a.href 链接的类匹配。

复选框:

<input type="checkbox" value="2" class="checkbox install">

链接:

<a class="iconDiskPlus install disablelink" href="#">Install</a>


【问题讨论】:

  • 你试过jquery的getattribute属性吗?在谷歌中搜索它
  • stackoverflow.com/questions/901712/… 检查复选框选中的属性。将这两者结合起来就可以了!
  • 如果您需要/想要有关 JavaScript 的帮助,请发布 (relevant/SSCCE) HTML。也许只有我一个人,但我真的厌倦了不得不问(似乎几乎每次都这样)并被期望猜测别人网站上发生的事情。 :帮助我们来帮助你!

标签: javascript jquery jquery-ui


【解决方案1】:

我想通了:

function refleshCheckboxes() {
    if ($("input.checkbox:checked").length > 0) {
        var arr = new Array(".install", ".uninstalled", ".enabled", ".disabled", ".download", ".remove");
        for (i = 0; i < arr.length; i++) {
            if ($("input.checkbox:checked").is(arr[i])) {
                $(".markActions a" + arr[i]).removeClass("disablelink");
            } else {
                $(".markActions a" + arr[i]).addClass("disablelink");
            }
        };
    }
    else {
        $("div.markActions a").addClass("disablelink");
    }
}

【讨论】:

    【解决方案2】:

    试试下面这个。

    $(function(){
    
        $('input.install').click(function(){ 
    
            var install_link =  $('a.install');
            if($('input.install:checked').length !=0){
            install_link.addClass('enablelink').text('install enabled');
            }
            else{
            install_link.addClass('disablelink').text('install disabled');                
    
            }                     
    });         
    });​
    

    查看 demo 的 js fiddle

    【讨论】:

      【解决方案3】:

      您可以像这样将 onclick 事件设置为复选框:

      <input id="someId" type="checkbox" value="2" class="checkbox install" onclick="myFunction()">
      

      在你的js文件中定义一个函数:

      function myFunction(){
          var checkBox = document.getElementById("someId");
          if(checkBox.checked == true){
              //you have to give an id attribute to the object
              // which you want to hide
              var hideIt = document.getElementById("id");
              hideIt.style.visibility = "none";
          }
      }
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2012-11-02
        • 2013-11-17
        • 1970-01-01
        相关资源
        最近更新 更多