我有一些代码,我循环遍历页面上的所有选择框,并将.hover事件绑定到它们,以便在它们的宽度上做一些麻烦mouse on/off.
这发生在页面准备就绪并且工作得很好.
我遇到的问题是,我在初始循环后通过Ajax或DOM添加的任何选择框都不会受到事件限制.
我找到了这个插件(jQuery Live Query Plugin),但在我用插件添加另外5k到我的页面之前,我想知道是否有人知道这样做的方法,无论是直接使用jQuery还是通过其他选项.
我想在这个div中附加一些HTML,HTML也必须有一个click事件.
<div id="myID">
<p>hello, world!</p>
</div>
我想在上面的div中插入一个新的div,我想在新的HTML上插入一个click事件.新div中会有一些动态文本,因此必须通过动态创建.
怎么做到呢？
我创建了一个绑定某些字段的jquery函数,但是当我添加一个新的内联时它不起作用.
主要问题是我不知道如何检测DOM中的插入并将其绑定到我的函数.
谢谢
我在jQuery/HTML5中有一个简单的前端(+后端生成的代码,它没有带来问题,所以我将省略它).当前使用的jQuery版本是1.8.3并且不存在版本冲突(即没有加载其他jQuery版本 - 它在其他系统中发生了很多次).
前端调用以下例程:
detailAjaxCall("\/client\/orders\/detailsLoad\/id\/3");
$(".upLink").click(function(){
console.log("subiendo");
var id = $(this).closest("tr").data('detail-id');
var url = "\/client\/orders\/detailMoveUp" + "/id/" + id;
detailAjaxCall(url);
return false;
});
$(".downLink").click(function(){
console.log("bajando");
var id = $(this).closest("tr").data('detail-id');
var url = "\/client\/orders\/detailMoveDown" + "/id/" + id;
detailAjaxCall(url);
return false;
});
$(".delLink").click(function(){
console.log("borrando");
var id = $(this).closest("tr").data('detail-id');
var url = "\/client\/orders\/detailDelete" + "/id/" + id;
detailAjaxCall(url);
return false;
});
注意:url字符串没有格式错误.它们是由json导出器生成的(这一段代码是从view sourceGoogle Chrome浏览器中的选项中提取的).评估它们中的任何一个都将返回一个没有反斜杠的字符串.
在detailAjaxCall("/client/orders/detailsLoad/id/<number>")实际工作:它返回预期的JSON代码,当我打的网址,并呈现此时,相应的表项:
function detailAjaxCall(url)
{
$.get(
url,
{},
function(data, status, xhr) {
//todo refrescar(data); …我在使用jquery添加列表项后单击时删除列表项有些问题.如果我不得不猜测为什么会发生这种情况,那是因为jquery可能会在添加列表项后查看我的原始HTML文档而不是更新的文档？无论哪种方式,我都无法弄清楚如何解决它.
这是我的HTML:
<form>
<div>
<label for="todo">I need to:</label>
<input type="text" id="todo" />
</div>
<button id ="add" type="button">Add to your to-do list!</button>
</form>
<ul>
</ul>
而我的jQuery:
$(document).ready(function() {
$('#add').click(function() {
var item = $('#todo')
$('ul').prepend("<li>"+item.val()+"</li>");
});
$('li').click(function() {
$(this).remove();
});
});
以下是我的代码,用于动态获取提要,然后通过在ID为"feeds"的部门内附加内容将其添加到页面上:
$.ajax({
url: 'http://api.feedzilla.com/v1/categories/'+newsId+'/articles.json',
type: 'GET',
dataType: 'json',
// to execute when successfully got json response
success: function(response){
$.each(response.articles, function(){
var feed= "<div class='media well'>"+
"<div class='media-body'>"+
"<h4 class='media-heading'>"+this.title+"</h4>"+
"<h6>"+this.publish_date+"</h6>"+
"<p>"+this.summary+"</p>"+
"<a href='"+this.url+"' target='_blank'>Continue Reading</a>"+
"</div><br><br>"+
"<button class='showinfo btn pull-right' id='info'>Show Info</button>"+
"</div>";
$('#feeds').append(feed);
});
},
// to execute when error
error: function(jqXHR, textStatus, errorThrown){
alert("Server error!");
},
// execute at last whether success or error
complete: function(){
}
});
正如您所看到的,我正在添加一个类'showinfo'以及id'info'来动态添加按钮.
现在以下是我的事件处理程序:
// SHOW INFO BUTTON CLICK HANDLER
$('.showinfo').click(function(){ …