jQuery：綁定功能上的文字輸入模糊

Question

我知道很多相關的問題到目前爲止已被問到，但我找不到真正解決我的問題。
從來就得到了相同的形式，從我的最後一個問題 -

body { 
 
    background-color: black; 
 
} 
 
.input-icon{ 
 
    float:left; 
 
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> 
 
<link href="https://www.w3schools.com/w3css/4/w3.css" rel="stylesheet"/> 
 
<form class="w3-container w3-white"> 
 
    <div class="w3-row-padding"> 
 
    <div class="w3-col m12"> 
 
     
 
<p> 
 
<i class="fa fa-envelope-o fa-2x fa-fw input-icon" aria-hidden="true"></i> 
 
<input class="w3-input w3-animate-input" type="text" placeholder="E-Mail" style="width: 40%; max-width: 90% !important;"> 
 
</p> 
 
    </div> 
 
    </div> 
 
</form>

，現在要的功能結合到通過jQuery我在模糊文本框。這是什麼新的代碼如下所示：

function myFunction(text) { 
 
    alert(text); 
 
} 
 
$(document).ready(function() { 
 
    $("#input").blur(myFunction("hello")); 
 
});

body { 
 
    background-color: black; 
 
} 
 

 
.input-icon { 
 
    float: left; 
 
}

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> 
 
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> 
 

 
<form class="w3-container w3-white"> 
 
    <div class="w3-row-padding"> 
 
    <div class="w3-col m12"> 
 

 
     <p> 
 
     <i class="fa fa-envelope-o fa-2x fa-fw input-icon" aria-hidden="true"></i> 
 
     <input class="w3-input w3-animate-input" type="text" placeholder="E-Mail" style="width: 40%; max-width: 90% !important;" id="input"> 
 
     </p> 
 
    </div> 
 
    </div> 
 
</form>

你可以很清楚地看到這個問題 - 它會執行myFunction的（）一次，永無。我聽說在執行.bind（）函數中的myFunction（）之前設置Timeout會有所幫助，但這並不真正向我解釋：爲什麼？
感謝所有的答案，一如既往地提前，
- SearchingSolutions（是的，尋找解決方案，幾乎每天都有;））

Answer 1

檢查這個fiddle。剛剛刪除了包含的外部js，並將模糊功能更改爲

$('#lol').on('blur',function(){ 
    myFunction(); 
}); 

$('#lol').trigger('blur');