单击<a>?</a>时如何获取上一个文本框值

时间:2013-12-05 11:40:45

标签: javascript jquery html dom

下面是我的代码,当我点击同一div中的<a>时,我试图获得上述文本框的值。我的意思是说,如果我点击第二个“添加到购物车”链接,它将根据我的屏幕截图给我“test2”。

<html>
<head>
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$( document ).ready(function() {

$(".ProductActionAdd a").click(function(){

    alert($('.ProductActionAdd a').prevAll(".ProductActionAdd a:first").attr('value'));
})
});

</script>
</head>
<body>
<div class="ProductActionAdd">
    <input type="text" value=""/>
    <a class="button" href="#">Add To Cart</a>
</div>
<div class="ProductActionAdd">
    <input type="text" value=""/>
    <a class="button" href="#">Add To Cart</a>
</div>
<div class="ProductActionAdd">
    <input type="text" value=""/>
    <a class="button" href="#">Add To Cart</a>
</div>
</body>
</html>

但没有获得成功。 this is my project image

请建议我解决。

7 个答案:

答案 0 :(得分:5)

您可以使用prev()获取textbox

$( document ).ready(function() {
    $(".ProductActionAdd a").click(function(){ 
        alert($(this).prev().val());   
        alert($('.ProductActionAdd a').prevAll(".ProductActionAdd a:first").attr('id'));
    });
});

描述:获取匹配元素集中每个元素的前一个兄弟,可选择由选择器reference进行过滤。

  

给定一个表示一组DOM元素的jQuery对象,   .prev()方法搜索每个元素的前任   在DOM树中,从匹配中构造一个新的jQuery对象   元件。

     

该方法可选地接受相同类型的选择器表达式   可以传递给$()函数。如果提供选择器,   前面的元素将通过测试它是否匹配来过滤   选择器,reference

答案 1 :(得分:4)

输入是点击的锚元素的上一个兄弟元素,因此请使用.prev()$(this).prev()

同样要获取元素的值,请使用.val()

$(document).ready(function () {
    $(".ProductActionAdd a").click(function () {
        alert($(this).prev().val());
    })
});

演示:Fiddle

答案 2 :(得分:4)

$(".ProductActionAdd a").click(function(){    
    alert($(this).closest(':input').val());
});

答案 3 :(得分:3)

试试这个

$(".ProductActionAdd a").click(function(){
    alert($(this).prev().val());
})

答案 4 :(得分:2)

是的,您可以使用jquery $(this)执行此任务。实现这一任务的方法不止一种。

您可以尝试jquery .prev()

$(".ProductActionAdd a").click(function(){
    alert($(this).prev().val());        
});

或者您也可以尝试使用jquery .parent()

查找父容器的输入
$(".ProductActionAdd a").click(function(){    
    alert($(this).parent().find('input[type="text"]').val());    
});

Try also in jsfiddle

答案 5 :(得分:1)

试试这个

$(".ProductActionAdd a").click(function(){
alert($(this).closest('div').find('input').attr('id'));
});

http://jsfiddle.net/BmkL8/

答案 6 :(得分:0)

检查一下:

$(".ProductActionAdd a").click(function(){

    $(this).prev("input[type=text]").val();
});