0

Webページにいくつかのラベルがあり、クリックすることができ、すべてクラス「btn」を共有しています。コンソールで、特にセレクターを使用すると$('.btn');、次の要素が表示されます。

<label id=​"skillstable_Certification" class=​"row btn">​Certification​&lt;/label>​,
<label id=​"skillstable_Compliance" class=​"row btn">​Compliance​&lt;/label>​,
<label id=​"skillstable_Technology" class=​"row btn">​Technology​&lt;/label>​,
<label id=​"skillstable_version(s)​" class=​"column btn">​Version(s)​&lt;/label>,​
<label id=​"skillstable_startdate" class=​"column btn">​StartDate​&lt;/label>​,
<label id=​"skillstable_enddate" class=​"column btn">​EndDate​&lt;/label>​,
<label id=​"skillstable_elapsedtime" class=​"column btn">​ElapsedTime​&lt;/label>,​
<label id=​"skillstable_expertiserating" class=​"column btn">​ExpertiseRating​&lt;/label>,​

HTMLと一致します：

</fieldset>
  <label id="fs_skillstable_heading" class="fs btn heading skillstable">Skills Table</label><br class="">
  <label id="skillstable_Certification" class="row btn">Certification</label>
  <label id="skillstable_Compliance" class="row btn">Compliance</label>
  <label id="skillstable_Technology" class="row btn">Technology</label><br class="">
  <label id="skillstable_version(s)" class="column btn">Version(s)</label><br class="">
  <label id="skillstable_startdate" class="column btn">StartDate</label><br class="">
  <label id="skillstable_enddate" class="column btn">EndDate</label><br class="">
  <label id="skillstable_elapsedtime" class="column btn">ElapsedTime</label><br class="">
  <label id="skillstable_expertiserating" class="column btn">ExpertiseRating</label><br class="">
</fieldset>

ただし、これらの要素は、$('.btn').on('click', function() {...})クリックされたことを示すconsole.log（）セクションを持つ関数にのみ登録されていません。彼ら全員が.btnクラスを持っているので、私はここで完全に迷子になっています。永続化に使用する配列を作成しようとしています。.push（）を使用してクイック変数を作成し、クリックしたすべての要素を表示して、その文字列を使用して永続的なURLを作成できるようにしましたが、これらのセクションは登録していません。

要素の生成は自己呼び出し関数内でスコープされている(function TCC() {...})();ので、その関数から要素を引き出して個別に呼び出してみましたが、それも機能しませんでした。また、関数を.click（）から.on（'click'、function（）{}）に切り替えました。

これがウェブページです。

4

4 に答える 4

2

これを試して; on（）の使用法：

編集：@David Thomasは、次this.id;よりも優れていると述べています$(this).attr('id');：

$(document).on('click','.btn',function() {
    var whichPart = this.id;
    console.log(whichPart);
});

これがjsFiddleです。

于 2012-07-31T14:07:24.903 に答える
1

この問題は、「列ボタンジェネレータ」ループの前にクリックイベントをバインドするために発生します。最も簡単な修正は、「ライブ」イベントを使用することです

$('.btn').live('click',function(){...})

または、ループのコールバックを作成して、クリックイベントをバインドします。

于 2012-07-31T14:20:15.557 に答える
0

次のリンクでサンプルコードをテストできます。

http://jsfiddle.net/shivkant/ueHNg/4/

于 2012-07-31T14:13:19.257 に答える
0

あなたのページは私にとってクロームで動作します。左側のセクションで専門知識/スキル/ツールなどをクリックすると、右側のオレンジ色のセクションでクリックしたリンクが表示されます。

コンソール/開発者ツールがすでに開かれている場合はIEで機能します。これは、コードでconsole.logステートメントを使用したことが原因である可能性があります。

これを参照してください

IE8のconsole.logはどうなりましたか？

于 2012-07-31T14:46:47.800 に答える