無法將字符串傳遞給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（不是真的很重要）。