如何检查字符串是否存在并更改另一个元素的字符串？

Question

您好，我正在尝试弄清楚如何检查特定字符串是否存在，如果该字符串不存在，请更改另一个节点的文本。

以下显示了我到目前为止所做的工作。我遇到的问题是，我执行文本更改的条件根本不起作用。不可否认，这是我第一次使用 indexOf()，所以我不确定我这样做是否正确。

// Check to see if there are non-refundable rates
// If they are NOT refundable DO NOT change the name
var taoIGCOR = jQuery('.rateInfoContainer[data-rate-code="RATECODE"]');
var taoRateBullet = jQuery('.rateBullet').text().indexOf('Non Refundable') <= -1;

if (jQuery(taoRateBullet).text().indexOf('Non Refundable') >= 1) {
// If 'Non Refundable' text IS NOT present, change it to this...
jQuery(taoIGCOR).text("THIS IS THE NEW RATE NAME");
alert("Change the rate name");
} else {
// If 'Non Refundable' text IS present don't do anything
alert("There are refundable rates here....don't do anything.");
}

.rateInfoContainer {
  border: 1px solid red;
  padding: 15px;
  margin-bottom:10px;
}

.rateName {
  border: 1px solid blue;
  padding: 15px;
}

.rateBullets {
  border: 1px solid green;
  padding: 15px;
}

.color {
  background: gray;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="rateInfoContainer" data-rate-code="RATECODE">
  <div class="rateName">
    This text does not change
    <div class="rateDescription">
      <ul class="rateBullets">
        <li>Non Refundable</li>
      </ul>
    </div>
  </div>
</div>

<div class="parent rateInfoContainer">
  <div class="textTarget rateName">
    This is the target text
    <div class="rateDescription">
      <ul class="nested rateBullets">
        <li>String not present...text should change</li>
      </ul>
    </div>
  </div>
</div>

<div class="parent rateInfoContainer">
  <div class="textTarget rateName">
    This text does not change
    <div class="rateDescription">
      <ul class="nested rateBullets">
        <li>Non Refundable</li>
      </ul>
    </div>
  </div>
</div>

大家help/guidance不胜感激！

布里昂

Answer 1

indexOf() returns 字符串在字符串中的索引位置，从位置 0 开始。如果找不到子字符串，则为 returns -1。

所以，如果你想知道 "Non Refundable" 是否在 .rateBullet 中，那么这个：

var taoRateBullet = jQuery('.rateBullet').text().indexOf('Non Refundable') <= -1;

应该是这样的：

var taoRateBullet = jQuery('.rateBullet').text().indexOf('Non Refundable') >= -1;

而且，如果您想知道 "Non Refundable" 是否不在 taoRateBullet 中，那么：

if (jQuery(taoRateBullet).text().indexOf('Non Refundable') >= 1) {

应该是这样的：

if (jQuery(taoRateBullet).text().indexOf('Non Refundable') === -1) {

现在，您还遇到了一些其他问题，因此请查看下面的评论以了解详细信息：

// It's a best-practice to name variables that hold JQuery wrapped sets
// with a leading $ to remind you that they are not standard DOM objects.
// You can also access JQuery with just "$" instead of "jQuery"
var $taoIGCOR = $('.rateInfoContainer[data-rate-code="RATECODE"]');

// Check to see if there are non-refundable rates
// If they are NOT refundable DO NOT change the name
if ($('.rateBullet').text().indexOf('Non Refundable') === -1) {
  // If 'Non Refundable' text IS NOT present, change it to this...
  $taoIGCOR.text("THIS IS THE NEW RATE NAME");
  alert("Change the rate name");
} else {
  // If 'Non Refundable' text IS present don't do anything
  alert("There are refundable rates here....don't do anything.");
}

.rateInfoContainer {
  border: 1px solid red;
  padding: 15px;
  margin-bottom:10px;
}

.rateName {
  border: 1px solid blue;
  padding: 15px;
}

.rateBullets {
  border: 1px solid green;
  padding: 15px;
}

.color {
  background: gray;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="rateInfoContainer" data-rate-code="RATECODE">
  <div class="rateName">
    This text does not change
    <div class="rateDescription">
      <ul class="rateBullets">
        <li>Non Refundable</li>
      </ul>
    </div>
  </div>
</div>

<div class="parent rateInfoContainer">
  <div class="textTarget rateName">
    This is the target text
    <div class="rateDescription">
      <ul class="nested rateBullets">
        <li>String not present...text should change</li>
      </ul>
    </div>
  </div>
</div>

<div class="parent rateInfoContainer">
  <div class="textTarget rateName">
    This text does not change
    <div class="rateDescription">
      <ul class="nested rateBullets">
        <li>Non Refundable</li>
      </ul>
    </div>
  </div>
</div>

如何检查字符串是否存在并更改另一个元素的字符串？

How can I check to see if a string exists and change the string of another element?

javascript

jquery

indexof