Question

我想根据下面列出的ul中选中的复选框调用AJAX函数。基于name="chkbrand_1"，每个复选框都有所不同，即。 chkbrand_1，chkbrand_2，chkbrand_3等。

我用这个

获得了正确的价值

   $('.searchType').click(function () {
                var checkboxName = $(this).attr("name");
                alert(checkboxName);
            });

但没有使用此

获得正确的值

 $('ul.chk li span').click(function () {
        var checkboxName = $(this).attr("name");
        alert(checkboxName);
    });

下面的

是Clint侧页的结果

<ul class="nav nav-list chk" id="brandnames">
    <li>
        <a style="padding-top: 2px; padding-bottom: 2px;">
            <input type="checkbox" name="chkbrand_1" id="chkbrand" value="Intex" />
            <span style="cursor: pointer;">
                Intex 
                <span class="badge badge-info">4</span>
            </span>
        </a>
    </li>
    <li>
        <a style="padding-top: 2px; padding-bottom: 2px;">
            <input type="checkbox" name="chkbrand_6" id="chkbrand" value="iPhone" />
            <span style="cursor: pointer;">
                iPhone 
                <span class="badge badge-info">5</span>
            </span>
        </a>
    </li>
    <li>
        <a style="padding-top: 2px; padding-bottom: 2px;">
            <input type="checkbox" name="chkbrand_5" id="chkbrand" value="Nokia" />
            <span style="cursor: pointer;">
                Nokia 
                <span class="badge badge-info">3</span>
            </span>
        </a>
    </li>
    <li>
        <a style="padding-top: 2px; padding-bottom: 2px;">
            <input type="checkbox" name="chkbrand_2" id="chkbrand" value="Samsung" />
            <span style="cursor: pointer;">
                Samsung <span class="badge badge-info">3</span>
            </span>
        </a>
    </li>
    <li>
        <a style="padding-top: 2px; padding-bottom: 2px;">
            <input type="checkbox" name="chkbrand_3" id="chkbrand" value="Sony" />
            <span style="cursor: pointer;">
                Sony 
                <span class="badge badge-info">2</span>
            </span>
        </a>
    </li>
    <li>
        <a style="padding-top: 2px; padding-bottom: 2px;">
            <input type="checkbox" name="chkbrand_4" id="chkbrand" value="Xolo" />
            <span style="cursor: pointer;">
                Xolo 
                <span class="badge badge-info">3</span>
            </span>
        </a>
    </li>
</ul>

Answer 1

$("input['type=checkbox']").on('change', function(e){ // event
   var checkboxName = $(this).attr("name"); //get checkbox name
   if(checkboxName == "chkbrand_4")
   {
      $.ajax(...) // your call
   }
});

OP编辑后。如果您需要输入value，您应该这样做，check fiddle：

$('ul.chk li span').click(function () {
    var checkboxName = $(this).parent().find("input").val();
    alert(checkboxName);
});

在mvc 4 razor中逐个检查列表中的每个复选框后，如何调用Ajax函数

1 个答案: