如何使用輸入事件的JavaScript與多形式

Question

輸入框如何使用輸入事件的JavaScript在輸入框，如果這樣

這是我的代碼，我使用的onclick但不工作，如果使用enter事件

如何使用此

<form id="msg_1" action="" method="post"> 
<input type="text" onclick="submit_msg("1")" name="post_msg_1"> 
</form> 
<form id="msg_2" action="" method="post"> 
<input type="text" onclick="submit_msg('2')" name="post_msg_2"> 
</form> 
<form id="msg_3" action="" method="post"> 
<input type="text" onclick="submit_msg("3")" name="post_msg_3"> 
</form> 

，這我的javascript

function submit_msg(uid) { 
var msg= $("#post_msg_"+uid).val(); 
var dataString = 'msg='+ msg; 
if (msg == '') { 
alert("Insertion Failed Some Fields are Blank....!!"); 
return false; 
} else { 
$.ajax({ 
type: "POST", 
url: "http://localhost/home/sendcmnt/"+uid, 
data: dataString, 
cache: true, 
success: function(html){ 
$('#msg_'+uid)[0].reset(); // To reset form fields 
} 
}); 
} 
return false; 
} 

如何使用輸入框和JavaScript與輸入？

thankyou

Answer 1

這種方法怎麼樣？

• 首先你輸入一些數值，然後按回車鍵輸入字段。
• 之後，表單將使用Ajax發送表單數據。

DEMO

HTML

<form id="msg_1" action="" method="post"> 
    <input type="text" data-uid="1" name="post_msg"> 
</form> 
<form id="msg_2" action="" method="post"> 
    <input type="text" data-uid="2" name="post_msg"> 
</form> 
<form id="msg_3" action="" method="post"> 
    <input type="text" data-uid="3" name="post_msg"> 
</form> 

和JavaScript

$('form').on('submit', function(e) { 
    var $form = $(this); 
    var $post_msg = $form.find('[name="post_msg"]'); 
    var msg = $post_msg.val(); 
    var uid = $post_msg.attr('data-uid'); 
    var dataString = 'msg='+ msg; 
    if (msg === '') { 
     alert("Insertion Failed Some Fields are Blank....!!"); 
     return false; 
    } else { 
     $.ajax({ 
     type: "POST", 
     url: "http://localhost/home/sendcmnt/"+uid, 
     data: dataString, 
     cache: true, 
     success: function(html){ 
      $form[0].reset(); // To reset form fields 
     } 
     }); 
    } 
    return false; 
    });