1.創建sjp頁面：

<tr>

<td><font>帳號：</font></td>

<td><input type="text" name="username"  id="username" value="" style="height: 20px;" onblur="checknames()"></td>

</tr>

2.編寫就是：

//校驗用戶名是否唯一

function checknames(){

var names = $("#username").val().trim();

var len = names.length;

alert(len);

if(names == ""){

alert("4156145:"+names);

alert("用戶名不能為空！");

return ;

}

else{

var names = encodeURI(encodeURI(names));

alert("填寫了："+names);

var url = "<c:url value='/user/create.action'/>?username=" + names;

alert(url);

$.ajax({

type: "post",

url: url,

dataType:'json',

success: function(data, textStatus){

if(data.success){

alert("恭喜可以注冊");

}

else{

alert(data.errorMsg);

}

}

});

}

}

3.效果圖：

JavaScript、jquery、angular、react是怎么實現獲取input輸入框中的值？

原生javascript : document.querySelector('input').value 這是瀏覽器提供的js訪問DOM對象的接口

jQuery主要為DOM選擇器做了封裝，簡化了語法，$('input').val()

vue、React、Angular都是采用了監聽input的onChange事件實現了雙向/單向數據綁定實時獲取input中的值

原理上，所有的庫和框架都在內部使用了原生javascript的方法獲取input中的值