일치하는 요소에 인라인 편집 (jQuery에서)을 적용하는 방법은 무엇입니까?

Question

이것은 아마도 더 일반적인 jQuery (또는 자바 스크립트) 질문 일 것입니다. 기본적으로 저는이 페이지에 데이터베이스 테이블의 모든 멤버를 나열하는 멤버십 포털에 jquery-in-place-editor 플러그인을 사용하고 있습니다. 따라서이 페이지에는 이름, 프로필, 프로필 이미지, 전자 메일 주소와 같은 일반적인 필드가있는 프로필이 여러 개 있다고 생각할 수 있습니다. 관리자가 각 프로필 (구성원 내 모든 필드)을 편집 할 수 있어야합니다. 동일한 페이지 내에서 문제는 인라인 편집을 적용 할 특정 요소를 선택할 수 있지만 모든 요소를 ​​동적으로 선택할 수는 없다는 것입니다. js 코드를 게시했습니다. 자세한 정보가 필요하면 알려주십시오.

$(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'> 
        a.b@c.com 
       </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'> 
        abc@def.com 
       </p> 
       <p class='profile' id='2'> 
        This is abc 
       </p> 
      </div> 
    </li> 
</ul> 

그래서 내 update.php, 그 이름으로 작동 해당 ID에 대한 당 테이블을 업데이트합니다.

여기서 볼 수 있듯이 $(".name")은 모든 clas = "name"(이 경우 둘 이상의 요소가 있음)을 선택하면이 모든 요소를 ​​반복하여 호출 할 수 있지만 그 방법을 호출 할 수는 있지만 나를 위해 너무 추악 해 보인다. 어떻게하면 이걸 얻을 수 있을까요? 감사!

Answer 1

당신이 가지고있는 코드가 작동하지 않는 경우 (이 그랬다면 그것이 좋은 것, 그것은 내가 이해 할수 않도록 플러그인의 저자를 다시 작성해야)이 있어야합니다

$(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를 참조하십시오