我有一个脚本,可以构建一个包含内容的动态div。初始化构建的按钮使用onclick命令和ajax调用来检索适当的信息,然后构建div。这一切都很好用,它构建了div,jquery显示了div,按钮变成了close按钮。现在的问题是,按钮上仍然附加了onclick命令,我打算去掉这个命令,如果用户想要再次查看信息,就重新应用它。
初始加载时的按钮代码:
<img class="showPixFeature hidden" id="butShowImage_<?php echo $row_rsFeatureAds['AdID']; ?>" src="../images/class_see_more.png" align="absmiddle" onclick="getRemoteInfo('PicDetailFeature_<?php echo $row_rsFeatureAds['AdID']; ?>')" style="cursor: pointer" />构建div的脚本:
function showImage(IDS, selectedID){
var adType = new Array();
adType = IDS.split("_");
//alert(adType);
var thumbs = new Array();
thumbs = adType[1].split("~");
var adID = thumbs[0];
//alert(adType[0] + '_' + thumbs[0]);
var picImage = document.getElementById(adType[0] + '_' + thumbs[0]);
removeChildren(picImage);
var picThumbs = document.createElement('div');
arLen = thumbs.length;
//alert(arLen);
if(arLen > 2){
for ( var i=1, len=arLen; i<len; ++i ){
//alert(thumbs[i]);
var thumbNail = document.createElement('img');
thumbNail.src = "../images/listings/" + adID + "_" + thumbs[i] + "_sm.jpg";
thumbNail.className = "thumbNails";
thumbNail.id = adID + '_' + thumbs[i];
picThumbs.appendChild(thumbNail);
picImage.appendChild(picThumbs);
addHandler(adID, thumbs[i], 1);
}
}
var previewImageContainer = document.createElement('div');
var previewImage = document.createElement('img');
previewImage.id = 'full_' + adID;
previewImage.src = "../images/listings/" + adID + "_" + "1_.jpg";
previewImage.className = 'thumbNails';
previewImageContainer.style.width = "700px";
previewImageContainer.style.textAlign = 'center';
previewImageContainer.appendChild(previewImage);
picImage.appendChild(previewImageContainer);
var closeButton = document.createElement('img')
closeButton.src = '../images/close_pix.png';
closeButton.id = 'close_' + adType[0] + '_' + adID;
picImage.appendChild(closeButton);
addHandler(adID, 'close_' + adType[0], 2);
$("#" + adType[0] + '_' + adID).show('blind', {}, '1300');
$("#butShowImage_" + thumbs[0]).attr("src", "../images/close_pix.png");
$("#butShowImage_" + thumbs[0]).removeClass('hidden').addClass('shown');
}有没有办法去掉onclick命令?
感谢您的帮助!
发布于 2010-12-18 16:35:03
我更喜欢使用.delegate()和.undelegate()方法来绑定像这样的事件。委托与.bind()和.live()方法略有不同
下面是关于差异http://net.tutsplus.com/tutorials/javascript-ajax/quick-tip-the-difference-between-live-and-delegate/的很好的解释
记住这一点:)
发布于 2010-12-18 14:46:17
有几个问题我需要用你的代码来修复。首先也是最重要的是将你的功能和你的标记分开。这意味着删除通过元素触发的onclick事件。现在,这变得更加复杂,因为还需要通过标记传递PHP变量。
所以你的问题可以分成几个部分。
我敢肯定,这是一种糟糕的方式来组织functionality.
这里的主要目标是清理您的标记,使其更具可读性,并更好地包含应用程序的不同功能-功能、样式和信息。
首先,通过删除onclick事件侦听器来清理您的元素
<img src="example.jpg" id="someId_<?php echo id;?>;" class="showPixFeature" />'
其次,以您喜欢的任何方式附加事件侦听器。如果要动态生成图像,请使用。如果不是,请使用。
$('.showPixFeature').bind('click', function(){
// this function will execute everytime an element is clicked
// you have access to the element ID here via 'this' because
// the functions context is the element that fires it
alert($(this).attr('id'));
});然后可以使用接口移除绑定的事件。如果使用委托,则为。在这里,我们可以将ajax调用添加到
$('#my-element').unbind('click');发布于 2010-12-19 01:45:30
您可以使用.one()。它与使用.bind()相同,并且在使用一次后将其解除绑定。
https://stackoverflow.com/questions/4476987
复制相似问题