jQuery - 与选择/选项+点击/模糊冲突的问题

Question

这里的情况： 我有一个垂直菜单与div。每个div都有一个id。当我点击一个div时，它使用以下方法在div内添加了一个选择列表：

$ ('#mydiv').on ('click', function () { 
    var select = '<select name="menuList"><option value="test">test</option>...</select>'; 
    $ ('#mydiv').html (select); 
}) ; 

我想要做的事很简单。我想在选择选项时将用户选择定义为文本。我曾经试过，但它不工作：

$ ('select[name="menuList"]').on ('blur', function () { 
    $ ('#mydiv').html ($ ('select[name="menuList"] option:selected').val ()); 
}); 

此外，另一个问题是，当我从列表中选择一个选项，选定字段不保留用户的选择，它可以追溯到名单的第一位。基本上，问题不是真正的问题，因为我立即用包含他选择的文本字段来替换列表，但我想了解为什么会发生这种情况。

Answer 1

由于您在点击事件上设置了HTML（破坏性），因此每次单击div时都会替换html。你最好在document.ready和html上设置html，并使用hide/show或者创建一个标志，在设置内容时设置它，并且每次点击都检查它，这样你就不会重新创建菜单了。