.append问题.限制.append

.append issues. Limit .append

本文关键字:append 限制 问题      更新时间:2023-09-26

我有一个简单的html文本框连接到.keypress(funcion(){...},使jquery图标显示在它旁边,每当我按下键盘上的一个键。这样做的目的是在文本框中输入内容时显示jquery ui图标,以便在单击图标时保存用户的输入

它做了我想让它做的…但是我们都知道计算机语言倾向于文字化。每次我按下一个键…出现一个新的保存图标…每一次。请帮助我,我被卡在这部分了。

注:对于jquery ui图标,它有一个悬停函数。当我把图标

<div class="ui-state-default ui-corner-all saveButton" title="Save" style="float:left; height:20px;" ><span class="ui-icon ui-icon-disk"></span></div>

.append内部,它在出现时禁用(禁用悬停,从而保持一种颜色)。如果这些知识是关于你如何启用悬停,当它来自一个追加,你愿意分享,将是非常酷的。

        $(".solo1").keypress(function () {
        $("#kyo").append('<div class="ui-state-default ui-corner-all saveButton" title="Save" style="float:left; height:20px;" ><span class="ui-icon ui-icon-disk"></span></div><br />');
    });
</script>
<div id="kyo"> <input class="solo1" /> </div>

您可以简单地在页面加载时创建所有按钮,并在按下一个键时显示相应的按钮。然后在单击按钮时再次隐藏它:http://jsfiddle.net/jC7TR/1/.

$('.solo1').after('<div class="ui-state-default ui-corner-all saveButton" title="Save" style="float:left; height:20px;" ><span class="ui-icon ui-icon-disk"></span></div><br />')
.keypress(function() {
     $(this).next('.saveButton').show();
});
$('.saveButton').hide().click(function() {
    $(this).hide();
});

您有几个不同的选择。首先,在按键上添加按钮似乎有点过于频繁。您可能希望在其他事件(如.change.blur)上添加按钮。也就是说,对于当前的代码,您所需要做的就是检查按钮是否已经存在,如果不存在则追加它。

$kyo = $("#kyo");  
if( $kyo.find('.saveButton').length === 0 ) // if button doesn't exist
    $kyo.append('<div class="ui-state-default ui-corner-all saveButton" title="Save" style="float:left; height:20px;" ><span class="ui-icon ui-icon-disk"></span></div><br />');

而不是在keypress你可以使用.blur()有图标出现后,他们点击远离文本框?