我想知道,为什么更改元素的类(尚未尝试使用 id)会使其无法响应与类集一起使用的函数?
示例
js函数
function addImg(element) {
$(element).click(function() {
var $block = $(this).is('img') ? $(this).parent() : $(this);
var $name = $block.attr('id');
$('input[name="'+$name+'"]').click();
$('input[name="'+$name+'"]').change(function() {
$block.css('border-color', '#cecece')
readURL(this, $block);
});
});
}
DOM
<div class="has-img">
<a class="remove-image"> Remove Image </a>
<img src="blalbalba.jpg" />
</div>
js代码
$('.remove-image').click(function() {
$(this).parent().removeClass('has-img').addClass('no-img').find('img').remove();
$(this).remove();
});
addImg('.has-img img, .no-img');
在 .removeClass('has-img').addClass('no-img')
之后 addImg('.has-img img, .no-img');
函数不再适用于该元素。这是为什么?
最佳答案
绑定(bind)仅适用于在绑定(bind)事件时具有这些类之一的元素。试试这个:
$(document).on('click', '.has-img img, .no-img', function() {
var $block = $(this).is('img') ? $(this).parent() : $(this);
var $name = $block.attr('id');
$('input[name="'+$name+'"]').click();
$('input[name="'+$name+'"]').change(function() {
$block.css('border-color', '#cecece')
readURL(this, $block);
});
});
$(document).on('click', '.remove-image', function() {
$(this).parent().removeClass('has-img').addClass('no-img').find('img').remove();
$(this).remove();
});
关于javascript - 类更改后元素丢失属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17530820/