JQuery: Обработка чекбокса Событие Click с JQuery - PullRequest
5 голосов
/ 15 апреля 2010

Я не могу понять, что здесь происходит. У меня есть несколько вложенных списков флажков, которые я хотел бы проверить, когда родитель проверен. Что еще более важно, я даже не могу получить предупреждение, чтобы появиться. Как будто событие щелчка не срабатывает. Есть идеи?

<script type="text/javascript"> 
$(document).ready(function() {
$("#part_mapper_list input[type=checkbox]").click(function(){
    alert("clicked");
    if ($(this).attr("checked") == "checked"){
        $(this + " input").attr("checked") = "checked";
    } else {
        $(this + " input").attr("checked") = "";
    }
});
}
</script>
<link rel="stylesheet" href="style.css">
<div>
<ul id="part_mapper_list">
<?php
$makes = array("Audi", "BMW", "Mini", "Porsche", "Volkswagen");
$generations = array("Generation 1", "Generation 2", "Generation 3", "Generation 4", "Generation 5");
$modelclusters = array("Model Cluster 1", "Model Cluster 2", "Model Cluster 3", "Model Cluster 4", "Model Cluster 5");
$cars = array("Car 1", "Car 2", "Car 3", "Car 4", "Car 5");

    foreach($makes as $mappermake){
        echo "<li id=\"" . $mappermake . "\" class=\"mapper_make\">+<input type=\"checkbox\" name=\"mapper_make\" value=\"" . $mappermake . "\">" . $mappermake . "</input><ul>";
        foreach($generations as $mappergen){
            echo "<li id=\"" . $mappergen . "\" class=\"mapper_gen\">+<input type=\"checkbox\" name=\"mapper_gen\" value=\"" . $mappergen . "\">" . $mappergen . "</input><ul>";
            foreach($modelclusters as $mappermodelcluster){
                echo "<li id=\"" . $mappermodelcluster . "\" class=\"mapper_modelcluster\">+<input type=\"checkbox\" name=\"mapper_modelcluster\" value=\"" . $mappermodelcluster . "\">" . $mappermodelcluster . "</input><ul>";
                foreach($cars as $mappercar){
                    echo "<li id=\"" . $mappercar . "\" class=\"mapper_car\"><input type=\"checkbox\" name=\"mapper_car\" value=\"" . $mappercar . "\">" . $mappercar . "</input></li>";
                }
                echo "</ul></li>";
            }
            echo "</ul></li>";
        }
        echo "</ul></li>";
    }
?>
<input id="submit_mapping" type="submit">
</div>

Ответы [ 4 ]

11 голосов
/ 15 апреля 2010

Вам не хватает закрывающей скобки) в конце примера кода. Это ошибка копирования и вставки или дело в вашем коде?

$(document).ready(function() {
  $("#part_mapper_list input[type=checkbox]").click(function(){
    alert("clicked");
    if ($(this).attr("checked") == "checked"){
      $(this + " input").attr("checked") = "checked";
    } else {
      $(this + " input").attr("checked") = "";
    }
  });
});

Изменить для комментария ниже: Я не совсем уверен, что понимаю, что вы пытаетесь сделать, но попробуйте этот непроверенный код.

$(document).ready(function() {
  $("#part_mapper_list input[type=checkbox]").click(function() {
    $("#" + $(this).val() + " input[type=checkbox]").attr("checked", $(this).attr("checked"));
  });
});
3 голосов
/ 15 апреля 2010

Если предупреждение не сработало, возможно, проблема с нашей разметкой HTML, убедитесь, что она правильно сформирована и правильно вложены теги.

Я был бы очень полезен, если бы вы также могли опубликовать свой HTML-код, чтобы мы могли проверить проблему.

$(document).ready(function() {
  $("#part_mapper_list :checkbox").click(function(){
    alert("clicked");
    if (this.checked){
        //$(this + " input").attr("checked") = "checked";
    } else {
        //$(this + " input").attr("checked") = "";
    }
  });
});

, если разметка верна и действительна, напрямую получите доступ к проверенной правильностиобъекта rawdom вместо того, чтобы оборачивать его jquery, чтобы минимизировать накладные расходы.

1 голос
/ 15 апреля 2010

Попробуйте:

$(document).ready(function() {
  $("#part_mapper_list :checkbox").click(function(){
     $(this).find(":checkbox").attr("checked", this.checked);
  });
)};
0 голосов
/ 13 августа 2012

попробуйте отметьте несколько флажков с помощью jquery
установите все флажки одним щелчком мыши
при нажатии на несколько флажок
установите флажок с событием onclick
Отметьте все флажки с одним флажком выберите

HTML-код

<div class="field-type-list-boolean field-name-field-select-all field-widget-options-onoff form-wrapper" id="edit-field-select-all"><div class="form-item form-type-checkbox form-item-field-select-all-und">
 <input type="checkbox" id="edit-field-select-all-und" name="field_select_all[und]" value="1" class="form-checkbox">  <label class="option" for="edit-field-select-all-und">Select All </label>

</div>
</div>
<div class="field-type-list-boolean field-name-field-select-none field-widget-options-onoff form-wrapper" id="edit-field-select-none"><div class="form-item form-type-checkbox form-item-field-select-none-und">
 <input type="checkbox" id="edit-field-select-none-und" name="field_select_none[und]" value="1" class="form-checkbox">  <label class="option" for="edit-field-select-none-und">Select None </label>

</div>
</div>

<div id="edit-field-culture-und" class="form-checkboxes"><table class="multicolumncheckboxesradios-table"><tbody><tr class="odd"><td class="multicolumncheckboxesradios-column-first multicolumncheckboxesradios-column">&nbsp;</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-4">
 <input type="checkbox" id="edit-field-culture-und-4" name="field_culture[und][4]" value="4" class="form-checkbox">  <label class="option" for="edit-field-culture-und-4">Austria </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-7">
 <input type="checkbox" id="edit-field-culture-und-7" name="field_culture[und][7]" value="7" class="form-checkbox">  <label class="option" for="edit-field-culture-und-7">Croatia </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-13">
 <input type="checkbox" id="edit-field-culture-und-13" name="field_culture[und][13]" value="13" class="form-checkbox">  <label class="option" for="edit-field-culture-und-13">Finland (English) </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-17">
 <input type="checkbox" id="edit-field-culture-und-17" name="field_culture[und][17]" value="17" class="form-checkbox">  <label class="option" for="edit-field-culture-und-17">Hungary </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-16">
 <input type="checkbox" id="edit-field-culture-und-16" name="field_culture[und][16]" value="16" class="form-checkbox">  <label class="option" for="edit-field-culture-und-16">Latvia </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-20">
 <input type="checkbox" id="edit-field-culture-und-20" name="field_culture[und][20]" value="20" class="form-checkbox">  <label class="option" for="edit-field-culture-und-20">Norway (Norwegian) </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-23">
 <input type="checkbox" id="edit-field-culture-und-23" name="field_culture[und][23]" value="23" class="form-checkbox">  <label class="option" for="edit-field-culture-und-23">Slovakia (English) </label>

</div>
</td><td class="multicolumncheckboxesradios-column multicolumncheckboxesradios-column-last"><div class="form-item form-type-checkbox form-item-field-culture-und-24">
 <input type="checkbox" id="edit-field-culture-und-24" name="field_culture[und][24]" value="24" class="form-checkbox">  <label class="option" for="edit-field-culture-und-24">Sweden (Swedish) </label>

</div>
</td></tr><tr class="even"><td class="multicolumncheckboxesradios-column-first multicolumncheckboxesradios-column">&nbsp;</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-6">
 <input type="checkbox" id="edit-field-culture-und-6" name="field_culture[und][6]" value="6" class="form-checkbox">  <label class="option" for="edit-field-culture-und-6">Belgium (Dutch) </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-8">
 <input type="checkbox" id="edit-field-culture-und-8" name="field_culture[und][8]" value="8" class="form-checkbox">  <label class="option" for="edit-field-culture-und-8">Czech Republic </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-14">
 <input type="checkbox" id="edit-field-culture-und-14" name="field_culture[und][14]" value="14" class="form-checkbox">  <label class="option" for="edit-field-culture-und-14">France </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-3">
 <input type="checkbox" id="edit-field-culture-und-3" name="field_culture[und][3]" value="3" class="form-checkbox">  <label class="option" for="edit-field-culture-und-3">Ireland </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-18">
 <input type="checkbox" id="edit-field-culture-und-18" name="field_culture[und][18]" value="18" class="form-checkbox">  <label class="option" for="edit-field-culture-und-18">Malta </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-21">
 <input type="checkbox" id="edit-field-culture-und-21" name="field_culture[und][21]" value="21" class="form-checkbox">  <label class="option" for="edit-field-culture-und-21">Poland (Polish) </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-11">
 <input type="checkbox" id="edit-field-culture-und-11" name="field_culture[und][11]" value="11" class="form-checkbox">  <label class="option" for="edit-field-culture-und-11">Spain (Catalan) </label>

</div>
</td><td class="multicolumncheckboxesradios-column multicolumncheckboxesradios-column-last"><div class="form-item form-type-checkbox form-item-field-culture-und-25">
 <input type="checkbox" id="edit-field-culture-und-25" name="field_culture[und][25]" value="25" class="form-checkbox">  <label class="option" for="edit-field-culture-und-25">United Kingdom </label>

</div>
</td></tr><tr class="odd"><td class="multicolumncheckboxesradios-column-first multicolumncheckboxesradios-column">&nbsp;</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-5">
 <input type="checkbox" id="edit-field-culture-und-5" name="field_culture[und][5]" value="5" class="form-checkbox">  <label class="option" for="edit-field-culture-und-5">Belgium (French) </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-9">
 <input type="checkbox" id="edit-field-culture-und-9" name="field_culture[und][9]" value="9" class="form-checkbox">  <label class="option" for="edit-field-culture-und-9">Denmark </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-10">
 <input type="checkbox" id="edit-field-culture-und-10" name="field_culture[und][10]" value="10" class="form-checkbox">  <label class="option" for="edit-field-culture-und-10">German </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-15">
 <input type="checkbox" id="edit-field-culture-und-15" name="field_culture[und][15]" value="15" class="form-checkbox">  <label class="option" for="edit-field-culture-und-15">Italy </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-19">
 <input type="checkbox" id="edit-field-culture-und-19" name="field_culture[und][19]" value="19" class="form-checkbox">  <label class="option" for="edit-field-culture-und-19">Netherlands (Dutch) </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-22">
 <input type="checkbox" id="edit-field-culture-und-22" name="field_culture[und][22]" value="22" class="form-checkbox">  <label class="option" for="edit-field-culture-und-22">Portugal </label>

</div>
</td><td class="multicolumncheckboxesradios-column"><div class="form-item form-type-checkbox form-item-field-culture-und-12">
 <input type="checkbox" id="edit-field-culture-und-12" name="field_culture[und][12]" value="12" class="form-checkbox">  <label class="option" for="edit-field-culture-und-12">Spain (Spanish) </label>

</div>
</td><td class="multicolumncheckboxesradios-column multicolumncheckboxesradios-column-last">&nbsp;</td></tr></tbody></table></div>

ТОГДА КОД JQUERY

<script type="text/javascript" src="http://caarcher.biz/ryn/ryn/misc/jquery.js?v=1.4.4"></script>
<script language="javascript1.1" >
(function ($){

        $(document).ready(function(){
                    alert("this is text");

                        $("[id^='edit-field-select']").click(function(){
                            alert("found anoather one");
                            if($("#edit-field-select-all-und").is(":checked") )
                                {

                                    $("#edit-field-select-none-und").attr("disabled",true);
                                    $("#edit-field-select-none-und").attr("checked",false);
                                    $("[id^='edit-field-culture-und-']").attr("checked",true);
                                    $("[id^='edit-field-culture-und-']").attr("disabled",true);

                                }else if($("#edit-field-select-none-und").is(":checked"))
                                {
                                    $("#edit-field-select-all-und").attr("disabled",true);
                                    $("[id^='edit-field-culture-und-']").attr("checked",false);
                                    $("[id^='edit-field-culture-und-']").attr("disabled",true);
                                }
                                else
                                {
                                    $("[id^='edit-field-select']").attr("disabled",false);
                                    $("[id^='edit-field-culture-und-']").attr("checked",false);
                                    $("[id^='edit-field-culture-und-']").attr("disabled",false);
                                }
                        });




            });
}) (jQuery);
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...