[jQuery] input輸入框擴展(回車提交，監聽input值)

擴展功能

　　1. 回車提交

　　2. 有內容時，有“X”清除

思路

　　1. 用propertychange事件來監聽對象屬性的變化

　　2. 判斷用戶按鍵是否是回車來提交

代碼

  // 監聽input的值變化
  $("input.search").bind("input propertychange", function () {
    if ($(this).val() != "") {
        $("a.search-reset").fadeIn();
    } else {
        $("a.search-reset").fadeOut();
    }
  });
  // 點擊消除內容
  $("a.search-reset").click(function () {
      $(this).siblings(".search").val("");
      $(this).fadeOut();
  });
	// 判斷是不是回車
  $("input.search").keypress(function (e) {
    	// 兼容寫法
      e = e || window.event;
      key = e.keyCode || e.which || e.charCode;
      if (key == 13) {
          alert("發送AJAX請求")
      }
  });
  // 點擊SEARCH按鈕
  $("a.search-button").click(function (e) {
      alert("發送AJAX請求")
  });

Demo