替换输入字段的文本会移动其位置

Replacing text of input field moves its location

本文关键字:移动 位置 文本 输入 字段 替换      更新时间:2023-09-26

>我有一个由某些事件控制的搜索表单,当它模糊时,该函数会检查值是否为空,如果是,它会将默认搜索文本放回原位。

下面是指向示例页面的链接:http://merkd.com/community

以下是相关功能:

// searchInput is a jQuery reference to the <input> field
// searchTextColor is the original font color of the unfocused form
// searchText is the original search text
$('#header form').on('blur', 'input', function() {
    searchInput.css('color', searchTextColor);
    // When I comment these lines out, it doesn't move
    if ( searchInput.val() == '' ) {
        searchInput.val(searchText);
    }
});

要查看故障,请在搜索字段中键入一些文本,然后将其删除并模糊搜索表单,输入字段将向左移动。

知道为什么会这样吗?就像我说的,如果我不更改文本,那么它就不会移动。我不知道这会如何影响元素在页面中的位置。

问题

这是发生的,这就是问题发生的原因

见萤火虫

   <input type="text" value="Search Teams, Players, Etc." name="search">
    <img title="Search" alt="Search" src="/engine/themes/img/search.white.focus.png">
    <input type="submit" value="Search Teams, Players, Etc.">

溶液

    $('#header form').on('blur', 'input[name=search]', function() {// not use input other wise valuse also set in submit input box
        searchInput.css('color', searchTextColor);
        // When I comment these lines out, it doesn't move
        if ( $(this).val() == '' ) {
            $(this).val(searchText);
        }
});