如何應用內聯編輯（在jQuery中）匹配元素？

這可能是一個更一般的jQuery（甚至是Javascript）問題：基本上我使用jquery-in-place-editor插件作爲我正在構建的會員門戶，其中此頁面列出數據庫表中的所有成員。所以你可以想象這個頁面有許多配置文件，其中包含名稱，配置文件，配置文件圖像和電子郵件地址等典型字段，我希望能夠實現的功能是管理員可以編輯每個配置文件（一個成員的所有字段）在同一頁面內。問題是：雖然我可以選擇應用內聯編輯的特定元素，但我無法想出選擇所有元素的動態方法。我發佈了js代碼，如果您需要更多信息，請告訴我。如何應用內聯編輯（在jQuery中）匹配元素？

$(document).ready(function() { 
    $(".name").editInPlace({ 
     url: "./update.php", 
     field_type: "text", 
     saving_image: "./images/ajax-loader.gif", 
     show_buttons: true 
    }); 
});

HTML：

<ul class="column"> 
    <li> 
     <div class='block'> 
      <a href='member.php?memberid=3'> 
       update 
      </a> 
      | 
      <a href='delete.php?memberid=1' class='delete'> 
       delete 
      </a> 
      <div class='memberImage' id='1'> 
       <img src='http://www.somewhere.com/img.png' 
       /> 
       <h2> 
        <p class='name' id='1'> 
         a.b 
       </h2> 
       <p class='email' id='1'> 
        [email protected] 
       </p> 
       <p class='profile' id='1'> 
        this is whatever 
       </p> 
      </div> 
    </li> 
    <li> 
     <div class='block'> 
      <a href='member.php?memberid=2'> 
       update 
      </a> 
      | 
      <a href='delete.php?memberid=2' class='delete'> 
       delete 
      </a> 
      <div class='memberImage' id='2'> 
       <img src='http://www.somewhere.com/img2.png' 
       /> 
       <h2> 
        <p class='name' id='2'> 
         abc 
       </h2> 
       <p class='email' id='2'> 
        [email protected] 
       </p> 
       <p class='profile' id='2'> 
        This is abc 
       </p> 
      </div> 
    </li> 
</ul>

所以我update.php工作正如它的名字，每個該ID更新表。你可以看到，這裏的問題是$(".name")選擇所有clas =「name」（在這個例子中有多個元素），我知道我可以遍歷所有這些元素並調用方法，但是對我來說太難看了。任何建議如何我可以實現這一目標？謝謝！

來源

2009-12-22 John

我不確定你的問題是什麼。 '$（「。name」）。editInPlace（...）'將爲它選擇的所有元素添加編輯就地功能。除非我錯過了什麼，否則你應該有什麼工作。 – 2009-12-22 00:16:36

對不起，我應該說明是什麼問題：當我點擊名稱字段時，我看到Save [email protected]是什麼，它看起來像檢索所有prev和next元素值，我不知道爲什麼。 – John 2009-12-22 00:20:14

如果你的代碼不能正常工作（這將會是很好，如果它沒有，它確實是這樣我認爲這個插件的作者應該重新寫），這應該：

$(document).ready(function() { 
    $(".name").each(function(){ 
     $(this).editInPlace({ 
      url: "./update.php", 
      field_type: "text", 
      saving_image: "./images/ajax-loader.gif", 
      show_buttons: true 
     }); 
    }); 
});

見http://docs.jquery.com/Core/each#callback

來源

2009-12-22 00:18:18

是的，我掏出一些代碼，並驗證這確實是問題。正如你所說，作者應該重寫這個，因爲這是一個必須具備的功能。謝謝！ – John 2009-12-22 00:27:21

非常歡迎。 – 2009-12-22 00:30:23

如何應用內聯編輯（在jQuery中）匹配元素？

回答

相關問題