Событие Jquery на завернутом входном радио переопределить событие «проверено» - PullRequest
0 голосов
/ 23 февраля 2011

Я хочу проверить и снять флажок (переключить) радио, когда нажата кнопка "td", но сохранено событие ввода по умолчанию

<table>
   <tr>
      <td>
          <input type='radio'>
      </td>
   </tr>
</table>

Мои попытки кода:

Попробуйте 1: http://jsfiddle.net/UJXRu/

Попробуйте 2: http://jsfiddle.net/UJXRu/1/

Попробуйте 3: http://jsfiddle.net/UJXRu/2/

Предварительный просмотр:

$("td").click(function(e) {
    if (!$(e.target).is("input")) {
        var bool = !$(this).children("input").is(':checked');
        $(this).children("input").attr("checked", bool)
    }
    else{
        var bool2 = !$(e.target).is(':checked');
        $(e.target).attr('checked',bool2);
    }
});

Ответы [ 4 ]

3 голосов
/ 23 февраля 2011

Попробуйте это ..

$("td").click(function(e) {
    if (e.target.type !== 'radio') {
        $(this).find(":radio").trigger('click');
    }
});

Пример на jsfiddle .

Если вы хотите, чтобы кнопки td и radio переключали свойство радио-флажка, вы могли бысделать что-то вроде этого:

$("td").toggle(function() {
    $(this).children(":radio").attr("checked", true);
}, function() {
    $(this).children(":radio").attr("checked", false);
});

Пример на jsfiddle

0 голосов
/ 24 февраля 2011

В этом ответе переключатели не рассматриваются как флажки (пользователям это очень не нравится), и он пытается представить чуть более реалистичный сценарий.

$("tr.myRow").click(function(e) {
    // dont override the radio inputs default
    if ($(e.target).hasClass("childRadio") || e.target.tagName == 'LABEL')
        return;

    // find the child radio, and if it's not checked, check it.
    var $childRadio = $("input.childRadio", $(this));
    if (!$childRadio.attr('checked')) {
        $childRadio.attr('checked', 'checked');
    }
});

Я пошел на неприятностидобавить метки и использовать свойство name, чтобы переключатели были сгруппированы (что является причиной наличия переключателей).Таким образом, это сохраняет максимально возможное поведение по умолчанию и просто увеличивает количество кликов для выбора определенной дочерней радиокнопки.

Пример HTML ниже.

<tr class="myRow">  
    <td>
        <div>Some Content</div>
        <div>
            <label for="radio1">Radio 1 Label</label>
            <input type='radio' id="radio1" class="childRadio" checked="checked" name="Group1">
        </div>
        <div>More Content</div>
    </td>
</tr>
<tr class="myRow">
    <td>
        <div>
            <label for="radio2">Radio 2 Label</label> 
            <input type='radio' id="radio2" class="childRadio" name="Group1">
        </div>
    </td>
</tr>
0 голосов
/ 23 февраля 2011

Отвечая на ваш комментарий:

«Я хочу проверить переключатель, когда я нажимаю оба тд или переключатель»

Должно быть просто:

$("td").click(function(e) {
    $(this).find("input").attr("checked", true);
});

http://jsfiddle.net/lukemartin/UJXRu/3/

0 голосов
/ 23 февраля 2011

Почему бы просто не вызвать событие щелчка по умолчанию для входного тега:

$(this).children("input").click();
...