Действие jQuery click не вызывает атрибут onclick - PullRequest
0 голосов
/ 29 сентября 2010

У меня проблемы с получением функции, которая нажимает все флажки поиска.Кажется, что событие click срабатывает, но ни один флажок не устанавливается, ни myFunc () не вызывается.

Он отлично работает, когда нажимает каждый флажок вручную, но кто хочет сделать это с 40+ флажками - не мои пользователи.
Вы можете задаться вопросом, почему я использую div-onclick, а не прямо на поле ввода.Это потому, что я хочу предоставить своим пользователям область больше , на которую можно щелкнуть, чем маленький флажок.

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

Мне нужно быстрое решение, поскольку у меня нет времени.

HTML

<div id="container">
<a href="#" onclick="clickAndCheckAllMatch('search for this text');return false;">some text</a>
<div id="*actual_ID*" onclick="myFunc(a, b, c, d);">
  <input type="checkbox" id="book-*actual_ID*" onclick="this.parentNode.click;return false;">
</div>
</div>

JS

function myFunc(a, b, c, d) {
  // does stuff
}
function clickAndCheckAllMatch(value) {
  $('div[onclick*='+value+']').each(function(idx,e){
  $('book-'+this.id).click();
}

РЕДАКТИРОВАТЬ
Когда я изменил с div на label , мне не пришлось исправлять состояние флажка. div или block-element должны иметь какую-то проблему там.
Я также удалил onclick из * div * s, что означало, что я был в состоянии предназначаться для флажков непосредственно и мог изменить их значения ID напросто * actual_ID *.

function clickAndCheckAllMatch(value) {
  $('input[onclick*='+value+']').each(function(idx,e){
    // e == this
    $(this)[0].click();
    if ($(this).attr('disabled')) {
      //do nothing
    } else {
      if ($(this).attr('checked')) {
        //do nothing
      } else {
        $(this)[0].click(); // only one checkbox per ID
      }
    }
  });
}
function CheckAll() {
  $('#container input[type=checkbox]:not(:checked)').each(function(idx,e){
    $(this).click(); // notice the difference ?
  });
}

Ответы [ 4 ]

2 голосов
/ 18 марта 2011

Только что решил эту проблему, связанную с обработчиком событий флажка, отображаемым ASP.net как js-код в атрибуте onclick, который я хотел вызвать.Сначала попробовал с явным вызовом jQuery click click, но через некоторое время понял, что у меня это не получится.Таким образом, решение, которое работало для меня:

someOtherObject.click(eval($('input').attr('onclick')));

Приветствия.

1 голос
/ 29 сентября 2010

Вместо того, чтобы пытаться использовать событие для изменения значения флажка, я бы сделал две вещи:

  1. Чтобы предоставить пользователям большую область для нажатия, используйте элемент label, а не div. label элементы напрямую поддерживаются браузерами, вам не нужно ничего делать, чтобы они работали. Есть два способа их использования:

    <label><input type='checkbox'>Foo</label>
    

    или

    <input type='checkbox' id='chk1'><label for='chk1'>Foo</label>
    

    Первый вариант хорош тем, что вам не нужно использовать идентификаторы (которые должны быть абсолютно уникальными на странице, поэтому это становится проблемой); последний хорош для ситуаций разметки, когда вы не можете иметь input быть потомком label по любой причине.

  2. Если вам нужно изменить состояние в коде, измените его непосредственно, а не пытаясь вызвать событие. Например, если я хочу изменить состояние флажка chk1, я просто делаю это:

    $('#chk1').attr("checked", true); // or false, of course
    

    ... или снять все флажки в контейнере (полезно для ссылок «все» или «нет»):

    $('#container input[type=checkbox]').attr("checked", false); // or true, of course
    
1 голос
/ 29 сентября 2010

this.parentNode.click должно быть this.parentNode.click().

this.parentNode.click - это просто объект метода.Вызов этого не вызовет событие щелчка div.Вы должны добавить фигурные скобки после click, иначе событие не сработает.

0 голосов
/ 29 сентября 2010

Чтобы прокомментировать комментарий Pointy, используйте это:

$(document).ready(function(){
  $('.theAnchorTagClass').click(function(){
    //Code to check all boxes here or do whatever else you need...
  });
});

Просто замените что-то подобное на любой элемент, для которого вы пытаетесь захватить событие click.

...