找到下面的代码。我想在IE中使工作具有相同的功能。我正努力让它在IE 9上运行。
<html>
<head>
<script src="https://code.jquery.com/jquery-1.11.1.js"></script>
<script type="text/javascript">
var colors= ["#99b433", "#00a300", "#1e7145"];
$(document).ready(function(){
addBarColor();
});
var addBarColor = function(){
$('#lineColors').html("");
for(var color=0; color<colors.length; color++){
//Loading List of colors
var chartBarColor = colors[color];
var li = document.createElement('li');
li.style.width = "50px";
li.style.backgroundColor = chartBarColor;
//Adding Remove button to it.
var remove = document.createElement('span');
remove.id = "remove"+color;
remove.style.cursor="pointer";
remove.style.marginLeft = "40px";
//remove.onclick = function(){removeBarColor(color)};
//Adding x image
var removeImg = document.createElement('img');
removeImg.src = "https://cdn1.iconfinder.com/data/icons/diagona/icon/10/101.png";
//Appedning everything to UL
remove.appendChild(removeImg);
li.appendChild(remove);
$('#lineColors').append(li);
$("#remove"+color).attr('onclick', 'removeBarColor(\''+color+'\')');
}
}
//Removing the color from the array
var removeBarColor = function (index){
alert(index);
colors.splice(index, 1);
console.log(colors);
addBarColor();
};
</script>
</head>
<body>
<ul id="lineColors">
</ul>
</body>
</html>
Jquery的attr()函数似乎不能在IE 9中运行。或者我尝试了这个remove.onclick = function(){removeBarColor(color)};这似乎也不适用于IE9。
希望我的问题很清楚。感谢您的期待。
答案 0 :(得分:8)
我假设您正在讨论此attr
行:
$("#remove"+color).attr('onclick', 'removeBarColor(\''+color+'\')');
无论它是否在其他地方工作,如果你正在使用jQuery(或者甚至,坦率地说,如果你不是),不要像这样挂钩事件处理程序;使用现代技术连接处理程序,尤其是因为使用你已经使用的lib非常容易:
$("#remove"+color).on('click', removeBarColor.bind(null, color));
依赖于ES5的Function#bind
(可以填充);或者,您可以使用jQuery的proxy
:
$("#remove"+color).on('click', $.proxy(removeBarColor, null, color));
无论哪种方式,该代码所做的是创建一个新函数,在调用时,会调用removeBarColor
作为color
参数传递index
(并设置this
特别没有;好吧,好吧,在宽松模式下它将是window
,在严格模式下它将是null
)。然后它将该函数指定为click
处理程序。
另一种方法是保存元素上的颜色,然后通过查看单击的元素使removeBarColor
起作用,但上面是最小模型方法。