Question

我有一个项目列表。我希望能够单击按钮将项目添加到mySQL。在测试时我只有conf框来显示ID。麻烦的是我无法让它发挥作用。我是jQuery和AJAX的新手。我觉得这很容易。但经过一个早上从这里尝试了一堆不同的方法而没有运气，我想我会询问我的确切代码。

<page loaded with>
wp_enqueue_script('jquery');
wp_enqueue_script('jquery-ui-core');
wp_enqueue_script('jquery-ui-tabs');
wp_enqueue_script('jquery-ui-autocomplete');

<script>
function addCharItem () {
    var itemID = $(this).closest("td").find('input[name="itemID"]').val(); //this is close (I think) but message is showing as undefined.
//  var itemID = $("input").siblings(".itemID").val() //gets first ID in table only
    confirm ('The item ID is ' + itemID); 
//adding ajax and other stuff later.  
}
</script>

<html>
...
<tr>
  <td colspan="5"><dl><dt>Backpack (empty)</dt><dd></dd></dl></td>
  <td><input name="hdnItemID" type="hidden" value="742"/>
      <input name="btnAddItem" type="button" id="btnAddItem" value="+" onclick="addCharItem ()"/></td>
  <td><input name="btnBuyItem" type="button" id="btnBuyItem" value="$" /></td>
 </tr>
 ...
</html>

这都是在Wordpress中的模板php页面构建的。我不认为这些事情有任何奇怪之处。但如果有让我知道你还需要什么。感谢您的所有帮助和建议。我知道我必须遗漏一些小事我只是不知道这还不知道是什么。

Answer 1

您可以使用.siblings(selector)

 $(this).siblings('input[name="hdnItemID"]').val()

或

 $(this).prev('input[name="hdnItemID"]').val()

Answer 2

使用hdnItemID作为您的名字，而不是itemID

$(this).closest("td").find('input[name="hdnItemID"]').val();

Answer 3

所以看起来由于某种原因，上面的代码并没有抓住HTML元素。所以我实现了jQuery按钮。

<script>
  $(function() {
    $( "input[type=submit], a, button" )
      .button()
      .click(function( event ) {
        event.preventDefault();
        var thisValue = $(this).val(); //to distinguish buttons
        console.log(thisValue);
        var itemID = $(this).prev('input[id="hdnItemID"]').val()
        confirm ('The item ID is ' + itemID);
            //do other stuff
      });
  });
</script>

<html changes>
...
<tr>
  <td colspan="5"><dl><dt>Backpack (empty)</dt><dd></dd></dl></td>
  <td><input class="itemID" id="hdnItemID" type="hidden" value="742"/>
    <input type="submit" value="+" /></td>
  <td><input class="itemID" id="hdnItemID" type="hidden" value="742"/>
    <input type="submit" value="$" /></td></tr>
...
</html>

我希望我能告诉你为什么它不起作用。似乎我尝试过许多不同的方法。上面的建议也应该有效。如果有人知道为什么会这样，请告诉我。我，我相信还有其他人，很想知道这个＆＃34;陷阱＆＃34;问题。感谢所有提示！

jQuery选择Button旁边的隐藏输入值

3 个答案: