0

我循环了我的 html，并希望在用户单击按钮时获得特定的字段值。我很想检索正确的值，请帮帮我。

<div id="tabs1">
<table>
{foreach from=$this->products item=p}               
<tr>
<td><div class="tabs-product">
<div>
<input type='hidden' id='item' name='item' value='{$p.name}'/>
<input type='hidden' id='price' name='price' value='{$p.price}'/>
<button class="shareButton" onclick='post(); return false;'>Share</button>
</div></td></tr>
{/foreach}
</table></div>

<script>
 function post() {
    var item =  $(this).parent("tabs-product").attr("input");//this cause undefined
    var price = $('#price').val(); //this method only get first value
    alert(item + price);
}
</script>
4

3 回答 3

3 
var $product = $(this).closest('.tabs-product');
var item = $product.find('input[name="item"]').val();
var price = $product.find('input[name="price"]').val();
  • input是一个元素，而不是一个属性。
  • 您不能像在您的 中那样使用绝对 ID $('#price')，因为您有几个具有相同 ID 的元素（由循环打印） - 这既是规范非法的（但宽松的浏览器允许），而且无用
  • 使用input[name="..."]选择器，您可以查明input您实际需要的产品中的哪个元素。
  • 在这种情况下，parent并且closest工作得同样好，但我closest更喜欢这种情况下的灵活性，如果你改变对结构的想法并决定插入一个额外的元素，用于布局或任何其他原因。编辑：正如 TJ 在评论中指出的那样，我错过了<div>，这只是将这一点带回家。
于 2012-12-27T09:11:28.757 回答
1

您需要在代码中进行一些基本的更正。

  • 用绑定click事件jQuery来获取 jQuery 对象$(this)。

  • 您还需要使用 . 用于类选择器。在您的代码parent("tabs-product")中应该是parent(".tabs-product")

  • 具有类 tabs-product 的 div 不是按钮的父级，而是您需要转到父级 td 并找到项目和价格。

  • id 在页面中应该是唯一的，并且您将重复相同的项目和价格的 id。

$('.shareButton').click(function(){

    var item =  $(this).closest('td').find("#item").va();//undefined
    var price = $(this).closest('td').find("#price").va()
    alert(item + price);

});

要javascript onclick binding按照您的问题使用，您需要将源对象传递给 post 并将其转换为post.

<button class="shareButton" onclick='post(this); return false;'>Share</button>

function post(obj) {
     var item =  $(this).closest('td').find("#item").va();//undefined
    var price = $(this).closest('td').find("#price").va()
    alert(item + price);
}
于 2012-12-27T09:10:42.460 回答
-1

好的，当我看到您的代码时，您做错了。您迭代并创建具有相同 ID 的元素，这根本不是一个好的做法。所以我建议你使用class属性并使用Jquery.first()

<div id="tabs1">
<table>
{foreach from=$this->products item=p}               
<tr>
<td><div class="tabs-product">
<div>
<input type='hidden' class='item' name='item' value='{$p.name}'/>
<input type='hidden' class='price' name='price' value='{$p.price}'/>
<button class="shareButton" onclick='post(); return false;'>Share</button>
</div></td></tr>
{/foreach}
</table></div>

<script>
 function post() {
    var item =  $(this).parent("tabs-product").attr("input");//undefined
    var price = $('.price').first().val(); //get only first value
    alert(item + price);
}
</script>

其他人的答案还可以，但是拥有多个相同的 ID 并不是很好，尤其是在使用 Jquery 时

JQuery.first()参考 http://api.jquery.com/first/

JQuery.first()这里的示例用法http://jsfiddle.net/uAkE8/2/

于 2012-12-27T09:12:10.440 回答