javascript - 如何从 ul li 触发 onblur？

Question

我实际上是在突出显示每个 li单击时，想要“取消突出显示”被单击的 li单击其他地方或跳出时(通过影响 background-color 属性)。

此行为本质上是在模仿 <select>在它的突出显示行为中......我不使用select不过，因为我想在列出的元素中嵌套 HTML -- 你不能使用 <option> 来做到这一点.

我正在尝试使用 onblur ，这是行不通的...

这是 HTML:

<ul id = "list">
    <li>asdf</li>
    <li>qwerty</li>
<ul>

...这是 CSS:

    #list {
        list-style-type: none;
    }

...这是 jQuery/Javascript:

    function getEventTarget(e) {
        e = e || window.event;
        return e.target || e.srcElement; 
    }

    function highlightSelection(selection) {
        alert("It worked!");
        $(selection).css("background-color","#FFFF00");
    }

    // this function is not being triggered:
    function removeHighlight(selection) {
        $(selection).css("background-color","none");
    }

    var ul = document.getElementById("list");

    ul.onclick = function(event) {
        var target = getEventTarget(event);
        highlightSelection(target);
    };

    // this event is not working:
    ul.onblur = function(event) {
        var target = getEventTarget(event);
        removeHighlight(target);
    };

Answer 1

li 没有 blur因为他们不专注。尝试使用 mouseout 或 mouseleave。