Question

单击.bigadminbutton - 函数updateSub（）时如何获取$(.subname)的值。尝试了一切（所有组合的prev，sibiling，父母，孩子，发现......）但没有任何成功。我在这件简单的事情上失去了太多时间。

<div class='subdiv'>
     <input type='text' class='subname' value='Prva' />
     <a class="bigAdminButton"  href="#" onclick="updateSub()">
        <span class="bigAdminButtonText adminButtonText btnFix">Update</span>
     </a>
</div>

Answer 1

我想我不确定为什么.prev()无效。它似乎在这里：

function updateSub (el) {
    alert(el.prev('input.subname').val());
}

http://jsfiddle.net/UQBrp/

糟糕。忘记提及我将$(this)传递给函数。

<div>
  <input type='text' class='subname' value='Prva0' />
  <div class='subdiv'>
     <input type='text' class='subname' value='Prva1' />
     <a class="bigAdminButton"  href="#" onclick="updateSub($(this))">
        <span class="bigAdminButtonText adminButtonText btnFix">Update</span>
     </a>
  </div>
  <div class='subdiv'>
     <input type='text' class='subname' value='Prva2' />
     <a class="bigAdminButton"  href="#" onclick="updateSub($(this))">
        <span class="bigAdminButtonText adminButtonText btnFix">Update</span>
     </a>
  </div>
  <div class='subdiv'>
     <input type='text' class='subname' value='Prva3' />
     <a class="bigAdminButton"  href="#" onclick="updateSub($(this))">
        <span class="bigAdminButtonText adminButtonText btnFix">Update</span>
     </a>
  </div>
  <div class='subdiv'>
     <input type='text' class='subname' value='Prva4' />
     <a class="bigAdminButton"  href="#" onclick="updateSub($(this))">
        <span class="bigAdminButtonText adminButtonText btnFix">Update</span>
     </a>
  </div>
</div>

http://jsfiddle.net/UQBrp/1/

只需将this传递给updateSub()函数，并在函数中使用$()：

function updateSub (el) {
    alert($(el).prev('input.subname').val());
}

http://jsfiddle.net/UQBrp/3/

Answer 2

我更改了您的代码，因此您无需使用onclick来传递参数。一般来说，使用纯事件处理程序并将其与jQuery混合使用并不是一个好主意。 jQuery确保您可以获得最佳的跨浏览器事件处理。注意data-id元素。您可以在html标记上声明“data- *”属性，以便将元数据信息附加到该属性，然后从jQuery事件处理程序中访问该信息，而不是使用onclick处理程序传递信息。

<div class='subdiv'>
     <input type='text' class='subname' value='Prva' />
     <a class="bigAdminButton"  href="#" data-id="1">
        <span class="bigAdminButtonText adminButtonText btnFix">Update</span>
     </a>
</div>

然后事件处理程序可以获取id，如下所示：

$("a.bigAdminButton").click(function () {    
     var id = $(this).attr('data-id');
     alert(id + ": " + $(this).siblings('.subname').val());
});

jsFiddle链接：http://jsfiddle.net/cgencer/eU8d9/9/

您也可以使用$(this).prev()作为上面的代码，但如果您要在其间添加其他元素或更改元素的顺序，则会更敏感。

Answer 3

我真的不明白为什么你把jQuery和javascript混在一起..如果你使用jQuery然后做jQuery的话。你为什么要这样做才能使用“onclick”：

$('.bigAdminButton').click(function(){
    var x = $(this).prev('.subname').val();
    alert(x);//"Prva"
})

上面的例子在js小提琴中效果很好。 here is the link。不要混淆一切来混淆自己。希望有所帮助。

Answer 4

$('a.bigAdminButton').live('click', function () {
    alert($('input.subname').val());
});

如果这是重复使用的代码块，您可以使用：

$('a.bigAdminButton').live('click', function () {
    alert($(this).parent().find('input').val());
});

Answer 5

alert($(this).parent().closest('.subname').val());

Answer 6

$("a.bigAdminButton").click(function() {
    var subnameValue = $(".subname", $(this).parent()).val();
    // (rest of your function)
});

如何从$（this）中找到以前的元素？

6 个答案: