Jquery - 单击按钮后如何访问此元素

时间:2015-02-08 08:17:01

标签: javascript jquery

单击此按钮后如何访问此元素... 经过这么多尝试后,我们仍然不知道如何做到这一点......这是我的榜样...因为我想以自己的方式尝试这种方法http://jsfiddle.net/yXcZG/53/ ......

<div id="modalBodyContact" class="modal-body">
   <table width="100%" cellspacing="0" class="display" id="contactsTable">
      <tbody>
         <tr>
            <td>
               <p data-id="5" class="contactInfo">123321</p>
            </td>
            <td class="pull-right">
                <button data-id="5" class="edit" type="button">Edit</button>
                <button data-id="5" class="delete" type="button">Delete</button>
            </td>
         </tr>
         <tr>
            <td>
               <p data-id="6" class="contactInfo">123321</p> <---- I get this element after I click that EDIT BUTTON
            </td>
            <td class="pull-right">
                <button data-id="6" class="edit" type="button">Edit</button> // <---- I CLICK THIS then ACCESS to <p>
                <button data-id="6" class="delete" type="button">Delete</button>
            </td>
         </tr>
      </tbody>
   </table>
</div>

这就是我单击按钮时的操作...

$("#modalBodyContact").on('click', 'button.edit', function(){
   var contact_id   = $(this).data("id");
//im stuck here
});

编辑1

这是小提琴http://jsfiddle.net/mm6ce7t1/5

我想返回<p data-id="5" class="contactInfo">5555</p>而不是5555 ...怎么做?因为我想用文本框替换它..

3 个答案:

答案 0 :(得分:0)

[EDITED]

在你的函数&#34; TBox&#34;中,参数&#34; obj&#34;不是对象,是一个字符串,所以你需要传递对象而不是字符串。我再次更改您的代码以接受对象,请查看http://jsfiddle.net/mm6ce7t1/6/

$("#modalBodyContact").on('click', 'button.edit', function(){
  var contact_id   = $(this).data("id");
  var p = $("#modalBodyContact").find("p[data-id='" + contact_id + "']");
  console.log(p);
  TBox(p);
});

答案 1 :(得分:0)

如果要在按钮上生成onclick事件,请按this获取其属性,然后执行

  $("button.edit").on('click', function(){
   var contact_id   = $(this).attr("data-id");
   var text   = $(".contactInfo[data-id="+contact_id+"]").text();

   alert("id is "+contact_id+" text is"+text);

});

Fiddle

答案 2 :(得分:0)

请尝试以下代码:

$("#modalBodyContact").on('click', 'button.edit', function () {
    console.log($(this).parents('tr').find("p[data-id='" + $(this).data("id") + "']").text());
});

<强> Working JSFiddle.