使用Ajax更改包含链接的标签内部文本
本文关键字:标签 内部 文本 链接 包含 Ajax 使用 | 更新日期: 2023-09-27 18:12:01
我有一个包含如下链接的标签:
<label id="textlabel" > <a href="#" id="testlink">data</a> </label>
我试图使用Ajax来改变标签文本,但它不工作。
为了测试的目的,它在这里工作,但它不工作在我的网页(网页是全新的没有任何其他)。
$('#testlink').click(function(){
$('#testlabel').text("new data");
});
JavaScript: function myfunc(clicked_id) {
var label = document.getElementById(clicked_id).parentElement;
var params = "{'orderid':'" + clicked_id + "'}";
var fd = new FormData();
fd.append("orderid", params);
alert("test");
$("'#" + clicked_id + "'").click(function () {
$.ajax
({
url: 'Handler.ashx',
data: fd,
processData: false,
contentType: false,
type: 'POST',
success: function (result) {
$("'#"+label.id+"'").text(result);
}
})
});
}
更新:下面的ajax一般工作
<script type="text/javascript"> function myfunc(clicked_id) { var params = "{'orderid':'" + clicked_id + "'}"; var label = document.getElementById(clicked_id).parentElement; $("#"+label.id).click(function () { $.ajax({ type: "POST", url: "Handler.ashx", data: clicked_id, success: function (result) { $("#" + label.id).text(result); } }); }); }
我花了很多时间来查明问题,现在我认为问题是在自动生成元素中发现的。例如
<table> <tr><td><label id="lbl" style="background-color:yellow"> <a href="#" onclick="myfunc(this.id)" id="00000">Label</a> </label></td></tr> @for(int i=0;i<4;i++) { <tr><td> <label id="lbl+@i" style="background-color:yellow"> <a href="#" onclick="myfunc(this.id)" id="@i">Label</a> </label></td></tr> } </table>
ajax只改变第一个标签的文本,但不改变其他自动生成的链接和标签。当点击自动生成的链接
时,下面的部分不会运行 $("#"+label.id).click(function () {
$.ajax({
type: "POST",
url: "Handler.ashx",
data: clicked_id,
success: function (result) {
$("#" + label.id).text(result);
}
}); });
更新:最后我发现哪里出了问题。它是我使用的标签id。他们都有"+"后更改为"_",我的应用程序现在工作良好。
感谢所有帮助过我的人
问题代码更改后的更新
有一个小故障success: function (result) {
$("'#"+label.id+"'").text(result)
}
应该success: function (result) {
$("#"+label.id).text(result)
}
另外,为了测试标签对象是否存在,您可以添加
success: function (result) {
console.log(label); // DON'T FORGET TO REMOVE THIS LINE LATER BEFORE DEPLOYING
$("#"+label.id).text(result)
}
也许是因为在你的测试函数中,你把拼错了标签的id textlabel
作为testlabel
$('#testlink').click(function(){
$('#testlabel').text("new data");
});
?
那么在实际代码中:
success: function (result) {
$('#label.id).text(result);
}
#label.id
is
- 不是正确的jQuery选择器。应该是
'#textlabel'
- 缺少关闭'
嘿,如果你想更新所有包含链接的标签文本,请尝试这个代码我也更新了你的演示链接,请参考
$('[id*="test"]').text("ddaadfa");
看到演示
如果你使用ajax,那么你必须在success块中使用这段代码来更改链接
的文本success: function (result) {
$('[id*="test"]').text("ddaadfa");
}