这是我的div标签
<div id="generate">
</div>
我动态生成的html具有输入类型按钮控件,我已将其与唯一消息ID绑定,因此我可以在点击时区分按钮ID。
<input type="button" onclick="return GetSelectedRow(this);" class="btn" value="Post" id="b' +<%#Eval("id")%>'"/>
这是详细的代码。
$(document).ready(function () {
debugger;
var generateHere = document.getElementById("generate");
debugger;
generateHere.innerHTML = '<div class="card w-post"> <div class="alert alert-danger hide" id="AlertDiv" runat="server"> <asp:Label ID="ErrorMessageLabel" runat="server" CssClass="control-label" Text=""></asp:Label></div><div class="card-body"><textarea class="wp-text auto-size" id="TextBox1" placeholder="Write Something..."></textarea><div class="tab-content p-0"></div><div class="wp-actions clearfix"><div class="wpa-media-list pull-left"></div> <input type="button" onclick="SaveMessageRecord(); return false" class="btn" value="Post" id="btnInsertRecord"/> </div> </div> </div><div id="result"><div id="hello"><div id="Div1"><div class="card w-item"><div class="card-header"> <div class="media"><div class="pull-left"><img class="avatar-img" src="img/profile-pics/ACER.gif" alt=""/></div><div class="media-body" id="usernames"><h2><%#Eval("username")%></h2><small><%#Eval("posteddate")%></small><h5 id="msgids"><%#Eval("id")%></h5></div> </div></div><div class="card-body card-padding"><p><%#Eval("message") %></p><div class="wis-numbers"><span><i class="zmdi zmdi-comments"></i></span></div><div class="wi-stats clearfix"><div></div></div></div><div class="wi-comments"><div class="list-group" id="result2"><div class="list-group-item media"><div class="pull-right"> </div> <div class="media-body" id="welcome"> <a href="#" class="lgi-heading"><small class="c-gray m-l-10"></small></a><small class="lgi-text"><%#Eval("comments")%></small></div></div></div><div class="wic-form" id="commentsform"><textarea class="wp-text auto-size" data-ma-action="wall-comment-open" id="TextBox1" placeholder="Write Comments..."></textarea><div class="wicf-actions text-right"><button class="btn btn-sm btn-link" data-ma-action="wall-comment-close">Cancel</button><input type="button" onclick="return GetSelectedRow(this);" class="btn" value="Post" id="b' +<%#Eval("id")%>'"/></div></div></div></div></div></div></div>';
});
现在克隆div标签我用了
$(function () {
$.ajax({
type: "POST",
url: "RepeaterAjax.aspx/GetMessages",
data: '{}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
failure: function (response) {
alert(response.d);
},
error: function (response) {
alert(response.d);
}
});
});
function OnSuccess(response) {
debugger;
var xmlDoc = $.parseXML(response.d);
var xml = $(xmlDoc);
var welcome = xml.find("Table");
var table = $("#hello div").eq(0).remove();
welcome.each(function () {
debugger;
var welcome = $(this);
var msgid = $("h5", table).html(welcome.find("id").text());
$("p", table).html(welcome.find("message").text());
$("h2", table).html(welcome.find("username").text());
$("#usernames small", table).html(welcome.find("posteddate").text());
$("h5", table).html(welcome.find("id").text());
$("#commentsform input[type=button]", table).html(welcome.find("id").text());
$("#hello").prepend(table).prepend("<br/>");
table = $("#hello div").eq(0).clone(true);
});
}
我的问题是我无法获得与msgid连接的动态生成按钮,这是唯一的。所以点击时我可以区分生成的div ..
答案 0 :(得分:1)
我建议你给你的按钮一个css类,它对动态输出中的那个特定按钮是唯一的。因为在.each中你只处理输出的一次重复,在该部分中只有一个按钮与该类,你可以保证在不知道具体id的情况下找到它。因此,如果您的按钮现在看起来像这样(我已添加(class="specialButton"
):
<input type="button" onclick="return GetSelectedRow(this);" class="btn specialButton" value="Post" id="b' +<%#Eval("id")%>'"/>
然后在javascript中你可以改变
var msgid = $("h5", table).html(welcome.find("id").text());
到
var msgid = welcome.find(".specialButton").attr("id");
$("h5", table).html(msgid);
N.B。我假设将按钮的ID写入<h5>
标签是你的意图。你的原始代码行没有意义,所以如果你的意图不合适,请纠正我。
这将设置变量