6

これは私のhtmlです:

  <ul>
    <li>Milk</li>
    <li>Bread</li>
    <li class='fade'>Chips</li>
    <li class='fade'>Socks</li>
  </ul>

これは私のjs関数です:-

$("li").hover(
  function () {
    $(this).append($("<span> ***</span>"));
  },
  function () {
    $(this).find("span:last").remove();
  }
);

このタイプの出力が必要です:-

<ul>
        <li>Milk</li>
        <li>Bread</li>
        <li class='fade'>Chips</li>
        <li class='fade'>Socks</li>
<span> ***</span>
      </ul>

ここで、li のマウス ホバーに 1 つのスパンを追加しようとしています。
その仕事は完璧です。
しかし、最後のliの後に1回だけ追加したい。
ありがとう。

4

4 に答える 4

3

jQuery api manualで例を見つけましたが、これはあなたが望むものではありませんか?

$("li").hover(
  function () {
    $(this).append($("<span> ***</span>"));
  },
  function () {
    $(this).find("span:last").remove();
  }
);

または、マウスが離れたときにスパンを削除したくないので、1 つのスパンを追加したいだけです。

$("li").hover(function () {
  if ($(this).find('span').length == 0) {
    $(this).append($("<span> ***</span>"));
  }
});
于 2013-04-29T07:23:47.363 に答える
2

使用one:

$("li").one("hover", function () {
   $(this).append($("<span> ***</span>"));
});

http://api.jquery.com/one/

于 2013-04-29T07:18:23.433 に答える
0

スパンがすでに存在するかどうかを最初に確認するだけです。マウスが離れた後にスパンを削除したい場合、「ホバー」には 2 つの機能があることに注意してください。これは、mouseover と mouseleave を組み合わせたものと同等です。

$("li").hover(
  function () {
    if ($(this).is(':empty')) {
      $(this).append($("<span> ***</span>"));
    }
  });

参照: hoveremptymouseovermouseleave

于 2013-04-29T07:33:50.603 に答える