Question

我有一个项目列表，每个项目都有一个按钮和一个价格。我能够找到按钮，其中显示＆＃34;选择选项＆＃34;，然后将更改应用于另一个div，但是，它会更改所有<li>的div，而不仅仅是按钮文字出现。如何仅将更改包含在相关的<li>？

中

＆＃13;

if ($('ul li:contains("Choose Options")')) {
  $(".p-price").prepend("STARTING AT: ");
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul>
  <li>
    <em class="p-price">$1.95</em>
    <div class="ProductActionAdd">
      <a href="" class="btn">Add To Cart</a>
    </div>
  </li>
  <li>
    <em class="p-price">$4.95</em>
    <div class="ProductActionAdd">
      <a href="" class="btn">Choose Options</a>
    </div>
  </li>
  <li>
    <em class="p-price">$5.95</em>
    <div class="ProductActionAdd">
      <a href="" class="btn">Add To Cart</a>
    </div>
  </li>
</ul>

<script>
</script>

＆＃13;

上面的脚本确实找到了＆＃34;选择选项＆＃34;文本。但随后又增加了＃34;起点：＆＃34;到所有.p-price个实例。我如何才能更改同一.p-price中的<li>？因此，{＆＃34}添加到购物车的<li>＆＃34;按钮，不要在价格之前插入文本？

我已经阅读了.each()，return false和循环，但不确定我是否正在咆哮正确的树，因为我尝试了各种代码迭代那可怕的失败，但是当谈到这个特定的包含时，改变另一个div，我找不到任何接近的东西。

Answer 1

不需要if：只需将文本添加到可能存在的任何匹配元素：

$('li:contains("Choose Options") .p-price').
  prepend("STARTING AT: ");

＆＃13;

  $('li:contains("Choose Options") .p-price').
    prepend("STARTING AT: ");

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<ul>
  <li>
    <em class="p-price">$1.95</em>
    <div class="ProductActionAdd">
      <a href="" class="btn">Add To Cart</a>
    </div>
  </li>
  <li>
    <em class="p-price">$4.95</em>
    <div class="ProductActionAdd">
      <a href="" class="btn">Choose Options</a>
    </div>
  </li>
  <li>
    <em class="p-price">$5.95</em>
    <div class="ProductActionAdd">
      <a href="" class="btn">Add To Cart</a>
    </div>
  </li>
</ul>

＆＃13;

如果li包含文本，请将更改应用于同一li中的特定div，而不是全部

1 个答案: