Jquery attr函数在IE 9中不起作用

Question

Find the code below. 找到下面的代码。 I would like to make work the same functionality in the IE. 我想在IE中使工作具有相同的功能。 I am struggling to make it work on IE 9. 我正努力让它在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's attr() function doesn't seems to be working in IE 9. Alternatively I tried this remove.onclick = function(){removeBarColor(color)}; Jquery的attr（）函数似乎在IE 9中不起作用。或者我尝试了这个remove.onclick = function（）{removeBarColor（color）}; this also doesn't seems to be working in IE9. 这似乎也不适用于IE9。

Hope my problem is clear. 希望我的问题很清楚。 Thanks for help in anticipation. 感谢您的期待。

Answer 1

I assume you're talking about this attr line: 我假设你在谈论这个attr线：

$("#remove"+color).attr('onclick', 'removeBarColor(\''+color+'\')');

Whether it works elsewhere or not, don't hook up event handlers like that if you're using jQuery (or even, frankly, if you're not); 无论它是否在其他地方工作，如果你正在使用jQuery（或者甚至，坦率地说，如果你不是），不要像这样挂钩事件处理程序; hook up handlers using modern techniques, esp. 使用现代技术连接处理程序，尤其是 as it's really easy with the lib you're already using: 因为你已经使用的lib很容易：

$("#remove"+color).on('click', removeBarColor.bind(null, color));

That relies on ES5's Function#bind (which can be shimmed); 这依赖于ES5的Function#bind （可以是shimmed）; alternately, you can use jQuery's proxy : 或者，您可以使用jQuery的proxy ：

$("#remove"+color).on('click', $.proxy(removeBarColor, null, color));

Live Example 实例

Either way, what that code does is create a new function that, when called, will call removeBarColor passing in color as the index argument (and setting this to nothing in particular; well, okay, in loose mode it'll be window , in strict mode it'll be null ). 无论哪种方式，这是什么代码所做的就是创建一个新的函数，调用它时，会调用removeBarColor传递color作为index参数（和设置this到什么特别的，好了，好了，在宽松模式下，它会在window中，严格模式它将为null 。 Then it assigns that function as a click handler. 然后它将该函数指定为click处理程序。

Another approach is to save the color on the element, and then have removeBarColor work by looking at the element that was clicked, but the above is the minimal-mods approach. 另一种方法是保存元素上的颜色，然后通过查看被单击的元素使removeBarColor工作，但上面是minimal-mods方法。

Jquery attr函数在IE 9中不起作用

问题描述

1 个解决方案

解决方案1
8 已采纳 2014-09-26 10:22:00

Jquery attr函数在IE 9中不起作用

问题描述

1 个解决方案

解决方案1 8 已采纳 2014-09-26 10:22:00

解决方案1
8 已采纳 2014-09-26 10:22:00