Question

我有以下内容：

<asp:HiddenField ID="tab_indexer" runat="server" Value="tab_id" />
<ul class="tabs">
    <li>
        <input type="radio" name="tabs" id="tab_id" />
        <label for="tab_id">Identificação</label>
        <div class="tabcontainer"></div>
    </li>
    <li>
        <input type="radio" name="tabs" id="tab_message" />
        <label for="tab_message">Mensagem</label>
        <div class="tabcontainer"></div>
    </li>
</ul>

在不改变页面结构的情况下（因为我的ASP.net应用程序已经在这个内置工作）我需要，当输入[type =“radio”]更改checked属性时，它将它的id保存在“ tab_indexer“hiddenField，当页面加载时，由Id存储在HiddenField值中获取输入[type =”radio“]，并将其设置为已选中。

Javascript会是什么（我已经在页面上绑定了JQuery js包）？

到目前为止，感谢我在Stackoverflow上做的另一个问题，我得到了：

$(document).ready(function(){
  $("input[type=checkbox]").on('click', function(){$("tab_indexer").attr("value", $(this).attr("id"));});
  $($("tab_indexer").val()).attr('checked', 'checked');
});

但没有成功。

Answer 1

由于tab_indexer是一个ASP.NET控件，您必须使用Control.ClientID

在jQuery中，当您希望使用ID Selector (“#id”)选择元素时，即前缀id为#

将您的代码更改为

$(document).ready(function () {
    //Get tab_indexer element
    var tab_indexer = $("#" + <%= tab_indexer.ClientID %> );
    //Set checkbox checked with value stored in tab_indexer
    $('#' + tab_indexer.val()).prop('checked', 'checked');

    $("input[type=checkbox]").on('click', function () {
        $(tab_indexer).val($(this).attr("id"));
    });
});

Answer 2

您需要检查type=radio并需要为tab_indexer使用正确的id选择器，即$("#<%=tab_indexer.ClientID")以及设置值的逻辑

$(document).ready(function(){
  //bind event click
  $("input[type=radio]").on('click', function()
           {$("#<%=tab_indexer.ClientID").attr("value", $(this).attr("id"));});

  //set selected radio button checked
  var selectedRadioId=$("#<%=tab_indexer.ClientID").val();
  $('input[type="radio"]').each(function(){
    if(this.value==selectedRadioId){
      this.checked=true;
    }
  });

});

ASP.net恢复复选框状态

2 个答案: