Question

我很想知道在按钮旁边选择最接近的选项（值）是一种很好的做法。我想出了两种不同的方法，但不确定哪种方式更好。

var find1 = $(this).closest('td').find(':selected').val();
var find2 = $(this).closest('td').children().eq(0).val();

我已经创建了一个jfiddle帮助 http://jsfiddle.net/9kxces0n/3/

如果您对我使用的原因感到好奇：

$(document).on('click', '.get-col3-value', function(){});

这是因为我使用＆＃34;添加行＆＃34;来创建行。按钮，需要能够注册事件。如果我做了一个简单的

$(".get-col3-value").click(function(){});

在表格中创建行时，它不会注册click事件。

Answer 1

由于它们相邻，我建议.prev()

获取匹配元素集中每个元素的前一个兄弟，可选择由选择器过滤。

var find3 = $(this).prev().val();

此外，您可以为表格提供ID并执行

$("#tableid").on("click",".get-col3-value",function() ...

缩短输入路径

FIDDLE

普通JS：

function getPreviousSibling(obj) {
  var sib=obj.previousSibling;
  while (sib.nodeType!=1) sib=sib.previousSibling;
  return sib;
}
window.onload=function() {
  var classname = document.getElementsByClassName("get-col3-value");
  var myObj = function(){
   console.log(getPreviousSibling(this).value)
  } 

  for(var i=0;i<classname.length;i++){
    classname[i].addEventListener('click', myObj,false);
  }
}

FIDDLE

Answer 2

看起来.siblings()方法也有效，我想可以使用它，因为只有兄弟。

var find2 = $(this).siblings().val();

Fiddle

Answer 3

看到这个问题，它解决了许多关于如何在没有＆＃34;重度记忆的情况下指向精确元素的疑虑＆＃34;做法 jQuery pitfalls to avoid

正如他们所说，我建议你尽可能多地使用id，不要使用.find（）或类作为上下文。

如果您无法通过select选项限制id，请在代码中

尝试尽可能地限制上下文，例如在表上放置一个id。

由mplungjan评论

建议的修改

编辑（再次......抱歉）

怎么可能是纯粹的javascript中的解决方案（由@mplungjan提出）...我试一试但是无法到达prevSibling节点...... 在这看到它。我想你已经去了父母，然后遍历了childnodes

var classname = document.getElementsByClassName("get-col3-value");

var myObj = function(){
   console.log(this.previousSibling.tagName)
}
for(var i=0;i<classname.length;i++){
        classname[i].addEventListener('click', myObj,false);
}

http://jsfiddle.net/81hk9gw3/44/

获得最近选择选项的最快方法

3 个答案: