html更改整体背景,循环HTML元素和更改背景颜色

确定，

所以我有下面的JQuery代码，它改变了dt元素的背景颜色，该元素具有指定的特定类：

var match = $('.matchedOn:contains("' + matchedString + '")');

$(match).html($(match).html().replace(matchedString, "

style='background-color:#FFFF00'>" + matchedString + "

"));

这是$ .each循环的一部分，如果循环经历一次迭代，它似乎有效。例如，我有一个返回的数据集，其中有两个可能的匹配需要突出显示。为了证明这一点，我将模拟一些示例文本，这将形成循环。

First Iteration：string matchedString = Hello

第二次迭代：string matchedString = World

这两个字符串都在同一个dt元素中，例如：

'这是Hello World示例字符串'

上面的JQuery代码似乎只是高亮地显示'Hello'而不是'World'

任何想法为什么？我调试并逐步执行代码，我可以看到两个matchedString可变量都设置正确。

修改的

好的，抱歉延迟，我已经设法得到有问题的代码，这将有助于答案。

$.ajax({

type: "POST",

url: "Default.aspx/GetPopUpData",

cache: false,

data: JSON.stringify({ messageId: messageId, messageType: messageType, aml: true }),

contentType: "application/json; charset=utf-8",

dataType: "json",

error: function (xhr) {

var contentType = xhr.getResponseHeader("Content-Type");

if (xhr.status === 401 && contentType.toLowerCase().indexOf("text/html") >= 0) {

window.location.reload();

}

},

success: function (msg) {

var mtData = msg.d[0];

var tag13C = '';

var tag33BSeqB = '';

var tag50 = '';

var tag50SeqB = '';

var tag52 = '';

var tag52SeqB = '';

var tag53 = '';

var tag54 = '';

var tag55 = '';

var tag56 = '';

var tag56SeqB = '';

var tag57 = '';

var tag57SeqB = '';

var tag58 = '';

var tag59 = '';

var tag59SeqB = '';

var tag70 = '';

var tag70SeqB = '';

var tag72 = '';

var tag72SeqB = '';

var tag77B = '';

var violationCount = '';

if (messageType == "202") {

if (mtData["Tag13C"].length) {

tag13C = $.map(mtData["Tag13C"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag52"].length) {

tag52 = $.map(mtData["Tag52"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag53"].length) {

tag53 = $.map(mtData["Tag53"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag54"].length) {

tag54 = $.map(mtData["Tag54"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag56"].length) {

tag56 = $.map(mtData["Tag56"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag57"].length) {

tag57 = $.map(mtData["Tag57"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag58"].length) {

tag58 = $.map(mtData["Tag58"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag72"].length) {

tag72 = $.map(mtData["Tag72"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag50SeqB"].length) {

tag50SeqB = $.map(mtData["Tag50SeqB"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag52SeqB"].length) {

tag52SeqB = $.map(mtData["Tag52SeqB"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag56SeqB"].length) {

tag56SeqB = $.map(mtData["Tag56SeqB"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag57SeqB"].length) {

tag57SeqB = $.map(mtData["Tag57SeqB"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag59SeqB"].length) {

tag59SeqB = $.map(mtData["Tag59SeqB"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag70SeqB"].length) {

tag70SeqB = $.map(mtData["Tag70SeqB"], function (ele) { return '

' + ele; }).join('');

}

if (mtData["Tag72SeqB"].length) {

tag72SeqB = $.map(mtData["Tag72SeqB"], function (ele) { return '

' + ele; }).join('');

}

$('

Transaction Reference:

' + mtData["Tag20"] +

'

Related Reference:

' + mtData["Tag21"] +

'

Time Indication:

' + tag13C : '') +

'

Value Date / Currency Code / Amount:

' + mtData["Tag32"] +

'

Ordering Institution:

' + tag52 : '') +

'

Senders Correspondent:

' + tag53 : '') +

'

Receivers Correspondent:

' + tag54 : '') +

'

Intermediary:

' + tag56 : '') +

'

Account With Institution:

' + tag57 : '') +

'

Beneficiary Institution:

' + tag58 : '') +

'

Sender to Receiver Information:

' + tag72 : '') +

'

Ordering Customer:

' + tag50SeqB +

'

Ordering Institution:

' + tag52SeqB : '') +

'

Intermidary Institution:

' + tag56SeqB : '') +

'

Account With Institution:

' + tag57SeqB : '') +

'

Beneficiary Customer:

' + tag59SeqB : '') +

'

Remittance Information:

' + tag70SeqB : '') +

'

Sender to Receiver Information:

' + tag72SeqB : '') +

'

Currency / Instructed Amount:

' + tag33BSeqB : '') +

'

').appendTo('#mt202');

}

var amlData = msg.d[1];

if (amlData.length) {

$.each(amlData, function (index, item) {

var countries = ''; // intialize as empty string

var aka = '';

var identNum = '';

var listReason = '';

var names = '';

var reportCount = index + 1;

if (item.Countries.length) {

countries = $.map(item.Countries, function (ele) { return '

' + ele; }).join('');

}

if (item.Aka.length) {

aka = $.map(item.Aka, function (ele) { return '

' + ele; }).join('');

}

if (item.IdentNumbers.length) {

identNum = $.map(item.IdentNumbers, function (ele) { return '

' + ele; }).join('');

}

if (item.ListingReasons.length) {

listReason = $.map(item.ListingReasons, function (ele) { return '

' + ele; }).join('');

}

if (item.Names.length) {

names = $.map(item.Names, function (ele) { return '

' + ele; }).join('');

}

var matchedItem = item.MatchedItem.trim();

var matchedTag = item.MatchedTag;

var senderBic = item.SenderBIC.trim();

var match = $('.matchedOn:contains("' + matchedTag + '")');

$(match).html($(match).html().replace(matchedTag, "" + matchedTag + ""));

});

}

else {

$('

Violation Report(' + amlData.length + ')

').appendTo('#AMLresults');

}

}

});

$('#myModal').modal();

希望这会有所帮助

修改的

因此，第一个循环创建单个div，其中包含带有matchOn类的dt的内容。可以包含更多命中的第二个循环用于显示aml命中。

所以在Tag58中，“这是一个测试用例，请高亮我”写入模态。然后aml循环有匹配标签，所以第一次命中是'测试用例'因此任何包含匹配的类的标签都需要有这个测试高亮，等等。