在MVC 4剃须刀中一个接一个地选中列表中的每个复选框后如何调用Ajax函数

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);
    });

以下是克林特首页的结果

<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 ，应该这样得到， 请检查小提琴 ：

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