1

私は国のリストを持っています、そしてそれらはすべて空の「＃」アンカーリンクを持っています。

1つの国だけを空のdivに「コピー」するようにJQueryに指示することに固執していますが、JQueryはdiv内のすべての「＃」リンクを選択します。

JS Fiddleリンクを参照してください：http： //jsfiddle.net/michelm/yb7MR/

そしてこれが私がしたことです：

var country = $('a[href$="#"]').text();


$('a[href$="#"]').click(function () {
  event.preventDefault();

  $(this).addClass("active");

  if ($('a').hasClass("active")) {

    $('div.location').prepend('<p>Your Location is: </p>');
    $('div.location').text(country);
    $(this).removeClass("active");

  } else {
    $('a[href$="#"]').removeClass("active");

    $('a[href$="#"]').not("active");

    // do nothing

  }

});

<body>
    <a href="#">France</a><br />
    <a href="#">Italy</a><br />
    <a href="#">Spain</a><br />
    <a href="#">Germany</a><br />

    <div class="location"></div>
</body>

ありがとうございました

4

7 に答える 7

2

セレクター.activeを使用してクリックを取り除く
.not()

http://jsfiddle.net/ZLUNX/1/

$('a[href$="#"]').not('.active').click(function ( event ) {

    event.preventDefault();

    $(this).addClass("active").siblings().removeClass('active');
    $('div.location').html('<p>Your Location is: '+ $(this).text() +'</p>');

});

http://api.jquery.com/not-selector/
http://api.jquery.com/event.preventDefault/
http://api.jquery.com/siblings/

于 2013-01-05T06:48:03.327 に答える
2

この行を削除します $('div.location').text(country);

を使用してクリックした要素のテキストを選択し$(this).text()、そのテキストをdivに設定できます

このような$('div.location').text($(this).text());

http://jsfiddle.net/viswa317/359Qq/

于 2013-01-05T06:33:45.873 に答える
1

var country以前に値を割り当てた$('a[href$="#"]').click(function (event)ので、すべてのリンクの値を取得します。したがってvar country、クリックイベントの後に値を割り当て、値を割り当てます$(this).text()。そのため、そのリンク値を取得してdivに追加します。

ありがとう

于 2013-01-05T06:48:16.733 に答える
1

次のコードを使用します。

$('a[href$="#"]').click(function (e) {  
    e.preventDefault();  
    jQuery('a').removeClass('active');
    jQuery(this).addClass('active');
    $('div.location').html('<p>Your Location is: </p>' + jQuery(this).text());
});
于 2013-01-05T06:29:38.063 に答える
1

<a>現在、国の変数を、href値が。の各タグのすべてのテキスト値に設定しています#。また、ステートメントのactive前にクラスを設定すると、が呼び出されることはないため、コードを再考することもできます。現在のコードに関するもう1つの問題は、がオーバーライドされることです。そうは言っても、問題の横にコメントし、country変数をどこに配置して、正しいテキスト値にアクセスする方法を示しました。if elseelse.prepend().text()

$('a[href$="#"]').click(function (event) {  
    event.preventDefault();     

    $(this).addClass("active"); //This will cause the else statement below to never do anything

    if ($('a').hasClass("active") ) {           
        $('div.location').prepend('<p>Your Location is: </p>'); //This will be overridden later by the .text()
        var country = $(this).text(); //Set the country variable here, using the current text value for the element that triggered this event
        $('div.location').text(country);
        $(this).removeClass("active");
    } else { //Because of the addClass above this will never do anything!
        $('a[href$="#"]').removeClass("active");

        $('a[href$="#"]').not("active");

        // do nothing

    }
});

例： http： //jsfiddle.net/fewds/yb7MR/3/

于 2013-01-05T06:32:15.223 に答える
1

あなたの質問を正しく理解しているかどうかわかりません。私はあなたが変える必要があると思います

$('div.location').text(country);

に

$('div.location').text($(this).text());

このフィドルを確認してください。

于 2013-01-05T06:36:36.600 に答える
0

次のように使用してください：http：//jsfiddle.net/RKAHR/

 $('a[href$="#"]').click(function (e) {
  var country = $(this).text();
  e.preventDefault();
  $('a[href$="#"]').removeClass("active");
  $(this).addClass("active");

  $('div.location').prepend('<p>Your Location is: </p>');
  $('div.location').text(country);
});
于 2013-01-05T06:33:56.950 に答える