【问题标题】:Check checkbox when clicking on description单击描述时选中复选框
【发布时间】:2011-06-09 10:23:38
【问题描述】:

我将创建一个由 jQuery 和 JSON 构建的复选框列表。该列表将是可以向其发送消息的组的选择。它可能是更多群体之一。这部分我可以弄清楚。我遇到的问题是如何启用描述,以便在单击描述时选中复选框。

<div>
    <label for="group">
        Select lists
    </label>
</div>
<div>
    <input type="checkbox" name="group" id="group" value="1" title="Main List" />Main List
    <input type="checkbox" name="group" id="group" value="2" title="Secondary List" />Secondary List
</div>

【问题讨论】:

    标签: html asp.net-mvc checkbox


    【解决方案1】:

    使用带有for 属性的标签(我为复选框分配了不同的ID):

    <div>
        <label for="group">
            Select lists
        </label>
    </div>
    <div>
        <input type="checkbox" name="group" id="group1" value="1" title="Main List" />
        <label for="group1">Main List</label>
        <input type="checkbox" name="group" id="group2" value="2" title="Secondary List" />
        <label for="group2">Secondary List</label>
    </div>
    

    【讨论】:

    • 我还不能标记为答案,但这就是我要找的。我知道有些不对劲,我只是无法在任何地方找到答案。谢谢!
    【解决方案2】:

    另一种解决方案(不使用“for”属性)是将每个&lt;input /&gt; 字段包含在&lt;label&gt;&lt;/label&gt; 标记内。

    例子:

    <label><input type="checkbox" value="" /> Click Here to Check This</label>
    

    如果您必须显示带有inline-block 标签的复选框,这可能是一个解决方案。

    【讨论】:

      【解决方案3】:

      首先:你有一个重复的idid 应该是唯一的。

      最简单的方法是使用label标签,例如:

      <input type="checkbox" name="group" id="group_1" />
      <label for="group_1">description</label>

      现在您可以单击文本,它会切换复选框。另一种方法是使用 jQuery 的 click 函数:http://www.google.com/#q=jquery+check+checkbox+on+click

      【讨论】:

        【解决方案4】:

        如果您不想使用“标签”,也可以使用 jQuery

         <input type="checkbox" name="SelectionCheckbox" id="SelectionCheckbox" />  
        <div onclick="$('input[id $=SelectionCheckbox]').attr('checked', this.checked);"> 
             Lorem ipsum dolor sit amet, consectetur adipiscing elit
            </div>
        

        【讨论】:

          【解决方案5】:

          <label style="cursor:pointer" for="clickme">clickme</label><br>
          <span><input id="clickme" type="checkbox"/>anand</span> 

          【讨论】:

            【解决方案6】:

            必须给'input'标签中的'id'和'label'标签中的'for'赋值,并且两者必须相同。

            <input type="checkbox" id="web">
            <label for="web">Web research</label>
            
            <input type="checkbox" id="shop">
            <label for="shop">Shopping</label>

            【讨论】:

              猜你喜欢
              • 2012-05-13
              • 1970-01-01
              • 2014-03-21
              • 2016-11-14
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              • 2018-01-10
              • 2015-06-06
              相关资源
              最近更新 更多