1

私はJqueryを初めて使用し、クリックされたリンクを特定してif elseステートメントを実行する方法を見つけようとしています。これはビデオゲームのファンサイトです。

ユニットの統計用にテーブルを設定し、ボタンとして設定された Div の束 (ブロックに設定されたディスプレイとのリンク) を持っています。ボタンをクリックすると、そのユニットのデータと画像がテーブルに入力されます。私はそれが正しく機能しています。場合によっては、ユニットが異なるステータスを持つ代替武器を持っていることがあります。ユニットに代替武器がある場合にのみ td タグのテキストを取得するリンクが内部にある空白の tr タグがあります。

私が探しているのは、ページを離れたり更新したりせずに、そのリンクの代替 (トグル) 武器の統計情報を表示することです。私はそれを1つのユニットで動作させましたが、その特定のリンクが表示されるすべてのユニットに対して同じ方法でテーブルデータ(html)を交互に使用しています。どのボタンがクリックされたかを知る必要があり、alt リンクが表示されたときに、そのユニットの適切な武器データを切り替えます。

jquery を使用するのはまだ 2 日目なので、これが理にかなっていることを願っています。私は初心者なので、できる限り具体的に教えてください。本当にありがとう

私のhtmlの設定は.

<div id="unit1"><a href="#">Unit 1</a></div>

<div id="Unit2"><a href="#">Unit 2</a></div>

<div id="Unit3"><a href="#">Unit 3</a></div>

<table>

<tr>
<td><a id="altweapon" href="#"></a></td>
<td><span id="weapName"></span></td>
<td><span id="attack"></span></td>
<td><span id="range"></span></td>
</tr>

</table>

私のjqueryがセットアップされました。

$("#Unit1").click(function(){
   $("#altweapon").html("");
   $("#weapName").html("weapon 1");
   $("#attack").html("10");            

 });
$("#Unit2").click(function(){
   $("#altweapon").html("Alternate");
   $("#weapName").html("weapon 1");
   $("#attack").html("5");            

 });
$("#Unit3").click(function(){
   $("#altweapon").html("Alternate");
   $("#weapName").html("weapon 1");
   $("#attack").html("15");            

 });

$("#altweapon").click(function() {
    $("#altweapon").toggleClass("Wp1").toggleClass("Wp2");

    if ($("#altweapon").hasClass("Wp1"))
  {
        $("#weapon").html("Weapon 1");

  } else
  {
        $("#weapon").html("Weapon2");
  }
 });
4

3 に答える 3

2

これがあなたの質問に答えるかどうかはわかりませんが、あなたがしていることは何でも jquery data objectsについて学ぶことから利益を得ることができるようです. これで、設定を保存および取得できます。例えば ​​...

<a class="weapon" data-attack="10" data-range="1">Unit 1</a>
<a class="weapon" data-attack="12" data-range="2">Unit 1</a>
<a class="weapon" data-attack="15" data-range="3">Unit 1</a>

それからjQuery...

$('a.weapon').click(function({
    $('#weapName').html( $(this).html() );
    $('#attack').html( $(this).data('attack') );
    $('#range').html( $(this).data('range') );
});

$('body').data('foo', 52);特定の要素だけでなく、ドキュメント全体に適用されるように設定することもできます...

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

thisイベント ハンドラ内で objectを使用する必要があります。このオブジェクトは、内部で実行されるオブジェクト コンテキスト メソッドを参照します。私が使用している他の言語とは概念が大きく異なるため、地雷を踏まないように注意する必要があります。

例としてこのフィドルを見てください http://jsfiddle.net/qKB3p/5/

于 2012-07-31T14:13:49.647 に答える
0 
if(jQuery('#id').data('clicked')) {
    //Do whatever you want 
} else {
    // do whatever you want
}

これらを複数使用して、どの #id または .class がクリックされたかを確認できます。

別の方法は、var boolean を使用することです。これにより、トグルも可能になります。

これらすべての例で覚えておいてください$=JQuery

var isClicked = false;
$('#id').click(function () {
    isClicked = true;
});

if (isClicked) {
    // The link has been clicked.
} else {
    // The link has not been clicked.
}
于 2012-07-31T14:13:41.730 に答える