0

私のページは適度に複雑で、jqueryの動作がおかしいと確信しています。そのため、最初に関連するコンテンツを追加します。さらに情報が必要な場合は、お知らせください。提供します。

前提は、キーワードバブルを保持するdivがあることです。これらのバブルには、選択および選択解除できる関連情報を含むツールチップ（qTipプラグイン）があります。キーワードの関連情報が重複している場合があるため、1つを選択解除すると、他のすべてのキーワードを同時に選択解除する必要があります。このバブルのリストはajaxを介して動的に作成され、ライブでページに追加し続けることができます。

問題は、チェックボックスの一部をクリックしてもチェックが外れないことですが、別のツールチップで同じチェックボックスをクリックすると機能します...これにより、元のチェックボックスも正常に機能するようになります。なぜいくつかの仕事と他の仕事がしないのか私にはわかりません。ライブのonlick関数のバインディングやセレクターの記述方法に関係していると思います。

次の関数は、jsonオブジェクトに基づいてツールチップのhtmlコンテンツを書き込むため、コンテンツがそこにあると想定します。下部のjqueryコードは、チェックボックスにバインドした関数です。

function constructSpecializationsHTML(data){
    var html = '';
    for(i = 0; i < data.specializations.length; i++){
        if(data.specializations[i].name != ''){
            html += "<span class='is-specialization-line'>";
            html +=     "<input class='is-specialization-checkbox' type='checkbox' name='" + data.specializations[i].name + "' checked='" + isSpecializationChecked(data.specializations[i].name) + "'/>";
            html +=     "<span>" + data.specializations[i].name + "</span>";
            html += "</span><br />"; 
        } else {
            html += "This keyword is not known in our ontology";
        }
    }
    return html;
}

$(document).on("click", ".is-specialization-checkbox", function(){ 
    var $checkboxs = $(".is-specialization-checkbox[name='" + $(this).attr("name") + "']")
    $checkboxs.prop("checked", !$checkboxs.prop("checked"));
});
4

2 に答える 2

1

まず、クリックイベントが発生したとき、「チェック済み」プロパティはすでに変更されています。つまり、チェックボックスの状態が異なります。

変化

!$checkboxs.prop("checked")

に

$(this).prop("checked")

それを解決します。

次に、ツールチップを1つだけ表示した場合、選択すると1つのチェックボックスのみが返されます。チェックまたはチェックを外す前にすべてのツールチップを表示すると、正しい番号が返されます。私の推測では、qTipは、ツールチップのhtmlが表示されるまでDOMに追加していません。そのため、同じような名前のチェックボックスがすべてオフになっているわけではありません（少なくともそれだけだと思います！）

于 2012-05-30T22:33:38.900 に答える
1 
$(document).on("click", ".is-specialization-checkbox", function(){
    var $checkboxs = $(".is-specialization-checkbox[name='" + $(this).attr("name") + "']")
    $checkboxs.not($(this)).prop("checked", false);
});

に変更されthisました$(this)-そのように、選択解除から除外されるのはクリックされた特定のチェックボックスです。

于 2012-05-30T21:43:40.637 に答える