1

在过去的 3 天里,我试图让这个简单的例子工作,但无论我尝试什么,我似乎都无法理解我哪里出错了......

HTML:

<input type="text" id="textEntry" /> <button>Go</button>
<ul id="list">
    <li>Text from the input field will appear below</li>
</ul>

查询:

$('button').click(function() {
    $enteredText = $('#textEntry').val();

    if($enteredText.length === 0) {
        alert('PLace an item in the field box');
    } else {        
        $newListItem = $('<li/>').html($enteredText).appendTo('#list');
    }

});

$('li').live('mouseover mouseout', function(event) {
    if(event.type == mouseover) {
        $(this).css('background-color', 'yellow');
    } else {
        $(this).css('backgorund-color', 'transparent'); }
});

最终,我要做的是让用户在文本字段中输入一个项目,然后将其附加到现有列表中(这有效 - 没问题)。然后,用户可以将鼠标悬停在特定条目上,导致背景在鼠标悬停时变为黄色,在鼠标移出时变为透明(问题)。

任何帮助都会膨胀。

谢谢。

4

2 回答 2

1
if (event.type == mouseover)

您没有任何名为mouseover.

于 2012-12-02T14:36:19.887 回答
1

event.type为您提供字符串中的事件名称,因此mouseover应该是"mouseover".

$('li').live('mouseover mouseout', function(event) {
    if(event.type == "mouseover") {
        $(this).css('background-color', 'yellow');
    } else {
        $(this).css('backgorund-color', 'transparent'); }
});

编辑backgorund-color应该是background-color

于 2012-12-02T14:36:53.750 回答