-3

我正在编写一种脚本，并尝试使用 jquery 改进我的脚本。因此，我添加了一些代码。但是，此脚本无法正常运行。例如，

<button class="yapistir"><div class="durum">Sabit</div>
<button class="yapistir"><div class="durum">Sabit Değil</div>
<button class="yapistir"><div class="durum">Sabit ama tam değil</div>
<button class="yapistir"><div class="durum">Sabit görünümlü fakat değil</div>
<button class="yapistir"><div class="durum">Sabit etc.</div>

当我点击按钮时，每个硬粒小麦等级都在变化

我的代码如下，对于这种情况我该怎么办。国王问候。

<script type="text/javascript">
$(document).ready(function() {

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

          $('.durum').text("NewText");

   });
});
</script>

当我单击第一个按钮时，它将如下所示：

<button class="yapistir"><div class="durum">NewText</div>
<button class="yapistir"><div class="durum">NewText</div>
<button class="yapistir"><div class="durum">NewText</div>
<button class="yapistir"><div class="durum">NewText</div>
<button class="yapistir"><div class="durum">NewText</div>
4

4 回答 4

3

您必须仅针对.durumclicked 旁边的特定元素.yapistir：

演示

$(document).ready(function() {

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

          $(this).next('.durum').text("NewText");

   });
});

并且不要忘记关闭按钮标签。

于 2013-07-01T08:12:47.073 回答
1

编辑：现在问题已经改变：

$(this).next('div.durum').text('NewText');

作为上下文传递this，这意味着搜索.durum将仅限于当前元素。

$('.durum', this).text("NewText");

于 2013-07-01T08:13:51.700 回答
1

您可以使用下一个脚本：试一试

HTML：

<button class="yapistir"><div class="durum">Sabit</div></button>
<button class="yapistir"><div class="durum">Sabit Değil</div></button>
<button class="yapistir"><div class="durum">Sabit ama tam değil</div></button>
<button class="yapistir"><div class="durum">Sabit görünümlü fakat değil</div></button>
<button class="yapistir"><div class="durum">Sabit etc.</div></button>

JAVASCRIPT：

$(document).ready(function() {
    $('.yapistir').click(function() {
        $('.durum', $(this)).text("NewText");
    });
});

$(this)我们表明我们要修改包含在实际单击按钮中的类的div durum。

使用下一个 HTML，您可以获得：尝试一下

<button class="yapistir">a</button><div class="durum">Sabit</div>
<button class="yapistir">b</button><div class="durum">Sabit Değil</div>
<button class="yapistir">c</button><div class="durum">Sabit ama tam değil</div>
<button class="yapistir">d</button><div class="durum">Sabit görünümlü fakat değil</div>
<button class="yapistir">e</button><div class="durum">Sabit etc.</div>

JAVASCRIPT：

$(document).ready(function() {
    $('.yapistir').click(function() {
        $(this).next().text("NewText");
    });
});
于 2013-07-01T08:14:51.933 回答
0

你可以这样做：

$(document).ready(function () {
    $('.yapistir').click(function () {
        $(this).next('.durum').text("NewText");
    });
});

小提琴演示

于 2013-07-01T08:24:36.093 回答