0

何らかの理由で、編集クリックに保存ボタンのみが表示されます...キャンセルボタンで問題が発生する理由がわかりません...？以下は私のコードです 

$(".editlink").on("click", function(e){
    e.preventDefault();
      var dataset = $(this).prev(".datainfo");
      var savebtn = $(this).next(".savebtn");
      var cancelbtn = $(this).next(".cancelbtn");

      $(this).css("display", "none");
      cancelbtn.css("display", "block");
      savebtn.css("display", "block");     
});

これは私のHTMLページ全体です。 

<div id="wrapper">
  <section id="core">
      <div class="profileinfo">

          <div class="gear">
              <label>Primary E-Mail:</label>
              <span id="email_address" class="datainfo"><?php echo $row['email_address'] ?></span>
              <a href="#" class="editlink">Edit Info</a>
              <a class="savebtn">Save</a>
              <a class="cancelbtn">Cancel</a>
          </div>

          <div class="gear">
              <label>First Name:</label>
              <span id="first_name" class="datainfo"><?php echo $row['first_name'] ?></span>
              <a href="#" class="editlink">Edit Info</a>
              <a class="savebtn">Save</a>
              <a class="cancelbtn">Cancel</a>
          </div>

          <div class="gear">
              <label>Last Name:</label>
              <span id="last_name" class="datainfo"><?php echo $row['last_name'] ?></span>
              <a href="#" class="editlink">Edit Info</a>
              <a class="savebtn">Save</a>
              <a class="cancelbtn">Cancel</a>
          </div>

          <div class="gear">
              <label>About Me:</label>
              <span id="about_me" class="datainfo"><?php echo $row['about_me'] ?></span>
              <a href="#" class="editlink">Edit Info</a>
              <a class="savebtn">Save</a>
              <a class="cancelbtn">Cancel</a>
          </div>

          <div class="gear">
              <label>Interests:</label>
              <span id="interests" class="datainfo"><?php echo $row['interests'] ?></span>
              <a href="#" class="editlink">Edit Info</a>
              <a class="savebtn">Save</a>
              <a class="cancelbtn">Cancel</a>
          </div>
      </div>
  </section>

どういうわけか、私が試したすべてがうまくいきませんでした。1つのラベル/フィールドを機能させることができますが、HTMLに上記のように複数ある場合、キャンセルボタンが表示されます。

4

2 に答える 2

7

next()jQueryドキュメントで説明されているように：

一致した要素のセット内の各要素の直後の兄弟を取得します。セレクターが提供されている場合、そのセレクターと一致する場合にのみ、次の兄弟を取得します。

使ってみてくださいsiblings()

于 2012-08-22T00:11:55.093 に答える
0

次のようなことを試すことができます：

var cancelbtn = $(this).parent().find('a.cancelbtn');

実施例を見る

于 2012-08-22T01:02:07.957 に答える