將輸入文本放入span中 - 僅在鍵盤上工作

Question

我試圖將我的輸入值放入span中，不僅在頁面加載（替換文本）上，而且還在輸入時更改它。此代碼似乎當我鍵入新的東西成箱的工作：

$(document).ready(function(){ 
    $("#fname").on("change keypress input", function() { 
     $("#brand").text($(this).val()); 
    });  
}); 

然而，就是在那裏，不僅得到它，當我鍵入新的東西來改變一個更好的辦法，而且對頁面加載呢？ （即它會立即將內容拉開）。

謝謝。

Answer 1

只是觸發其中一個

$(function(){ 
    $("#fname").on("change keypress input", function() { 
    $("#brand").text($(this).val()); 
    }).change();  
}); 

Answer 2

您可以使用此代碼。我希望它會工作

$(document).ready(function(){ 
var load_text = $('#fname').text(); 
$("#brand").text(load_text); 
$("#fname").on("change keypress input", function() { 
    $("#brand").text($(this).val()); 
});  
}); 

您也可以使用此代碼

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$("#fname").on("change keypress input", function() { 
    $("#brand").text($(this).val()); 
}).change();  
}); 
</script> 


<form id="test_form"> 
<input type="text" id="fname" value="your_input_text" /> 
<span id="brand"></span> 
</form> 

Answer 3

您可以使用多個這樣的活動玩..

$("#fname").on({ 
    change : function(){ 
     //code here 
    }, 
    keypress : function(){ 
     //code here 
    }, 
    input: function(){ 
     //code here 
    } 
});