Question

我的HTML是

<input type="text" class='myclass' value="start">
<div>
    <input type="text" class='myclass' value="sea">
</div>
<button class="mybutton">Catch</button>
<br/>
<input type="text" value="end" class='myclass'>

和javascript是

$('.mybutton').click(function(){
    var text = $(this).prev('.myclass').val();
    console.log(text);
});

我想通过类名获取前一个输入值的值。但结果是undefined。我想得到值sea。问题出在哪儿？工作小提琴链接是Here >>谢谢。

Answer 1

catch按钮的前一个元素是div，因此你需要在find()里面做$('.mybutton').click(function(){ var text = $(this).prev('div').find('.myclass').val(); console.log(text); }); 像这样：

{{1}}

Answer 2

我想获得前一个输入的值

嗯，这就是问题，输入不是即时的。您可以使用prevAll方法代替：

$('.mybutton').click(function(){
    var text = $(this).prevAll('.myclass').val();
    alert(text);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class='myclass' value="start">
<div>
    <input type="text" class='myclass' value="sea">
</div>
<button class="mybutton">Catch</button>
<br/>
<input type="text" value="end" class='myclass'>

Answer 3

有趣。我之前从未使用过“.prev（）”函数。反正：

如果你在这里阅读https://api.jquery.com/prev/，你会发现：
“给定一个表示一组DOM元素的jQuery对象，.prev（）方法在DOM树中搜索每个元素的前任，并从匹配元素构造一个新的jQuery对象。”

此外：
如果不存在先前的兄弟，或者前一个兄弟元素与提供的选择器不匹配，则返回一个空的jQuery对象。

换句话说，如前所述，“。prev（）”只是查找前一个元素。

要按照您想要的方式执行您想要的操作，您可能需要考虑此处说明的“.prevAll（）”函数：https://api.jquery.com/prevAll/

但是又一次，因为你想要的元素实际上是前一个元素的孩子而不是直接兄弟，你可能想要考虑初学者的建议：

$('.mybutton').click(function(){
    var text = $(this).prev('div').find('.myclass').val();
    console.log(text);
});

但实际上你应该能够通过删除'div'选择器来使它更简单：

$('.mybutton').click(function(){
    var text = $(this).prev().find('.myclass').val();
    console.log(text);
});

只要您确定您的'.myclass'元素将是前一元素的子元素，无论父元素是什么（div，span，等等），这都应该起作用

jquery捕获以前的类问题

3 个答案: