Question

我有一大堆用PHP生成的HTML代码。

HTML看起来像这样：

<input type="text" id="10"><button onclick="process()">send</button>

<input type="text" id="11"><button onclick="process()">send</button> <!-- and so on until id=N -->

PHP代码就像：

<?php while ($row = $result->fetch_assoc()) { ?>
<input type="text" id="<?=$row['id']?>">
<button onclick="process()">send</button>
<br>
<?php } ?>

如果用户点击发送按钮，则输入标记的值会传递给 process（）功能。< / p>

这就是我遇到的问题：我不知道应该在进程（）中的 getElementById 中指定哪个输入ID？功能 - 因为我不知道按下了哪个按钮。

对任何帮助都会很有帮助。

Answer 1

虽然它不是首选方式，但如果你想坚持使用内联事件处理程序，你可以这样做：

function process(elem){
  alert(elem.previousSibling.value);
  
}

<input type="text" id="10"><button onclick="process(this)">send</button>
  <input type="text" id="11"><button onclick="process(this)">send</button>

请注意

基于Gecko的浏览器将文本节点插入到要表示的文档中源标记中的空格。因此获得了一个节点例如，使用Node.firstChild或Node.previousSibling可以引用a 空白文本节点而不是作者的实际元素意图得到。

previousSibling

Answer 2

与之前的答案一样，理想情况下，您应远离内联事件。但是，如果你不得不这样做的解决方案是两个，默认情况下，如果一个事件对象没有被任何一个方法覆盖，它就被传递给事件处理程序方法。

这样的方法将为您提供有关事件目标元素的足够信息。（行为可能因浏览器而异，因此可能需要彻底测试..）

function EventHandler(e) {
    e = e || window.event; 
    var target = e.target || e.srcElement;
    console.log(target);
}

现在你可以通过执行target.id来调用获取id，或者你基本上可以获得任何属性值。

Ajax：如何使用dynamicaly generatd ID获取元素的值

2 个答案: