无法将字符串传递给jquery函数

Question

我希望获取搜索输入的当前值，然后清除焦点上的输入框，存储该字符串并将其传递到函数中以在模糊上重新填充输入框。

$("input#search").bind('focus', function() { 
    var search_text = document.getElementById('search').value; 
    $("input#search").val(""); 
}).bind('blur', function(search_text) { 
    $("input#search").val(search_text); 
}); 

目前，这成功地抓住了价值上的焦点并清除输入框，但模糊，它填充与[object Object]输入。

我是否正确地传递了第4行的字符串？

Answer 1

首先，不要使用bind()。它已被弃用长时间前。改为使用on()。

关于你的问题，你不能直接传递参数给匿名处理函数。由于它的立场，你的search_text变量将持有blur事件。

要修复此问题，您可以将变量存储在#search元素本身的data属性中。试试这个：

$("input#search").on('focus', function() { 
 
    $(this).data('search-text', this.value).val(''); 
 
}).on('blur', function(search_text) { 
 
    $(this).val($(this).data('search-text')); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="search" value="foo bar" />

此外，你在这里创造的行为类似于placeholder属性。可能值得研究，看看它是否符合你的需求。

Answer 2

使用jQuery的.on（）注册事件。

var search_text; 
$("input#search").on('focus', function() { 
    search_text = document.getElementById('search').value; 
    $("input#search").val(""); 
}); 

$("input#search").on('blur', function() { 
    $("input#search").val(search_text); 
}); 

替代可能是，

$("input#search").on('focus', function() { 
    var search_text = document.getElementById('search').value; 
    $("input#search").val(""); 

    $(this).on('blur', function() { 
    $("input#search").val(search_text); 
    }); 
}); 

Answer 3

号这里是你会怎么做，该事件侦听器之前声明的变量，因此，它在范围：

var search_text; 
$("input#search").bind('focus', function() { 
    search_text = document.getElementById('search').value; 
    $("input#search").val(""); 
}).bind('blur', function() { 
    $("input#search").val(search_text); 
}); 

在驼峰命名变量，所以你宁愿在JavaScript中使用的约定searchText（不是真的很重要）。