[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

[jQuery]Input输入框扩展(回车提交，监听input值)

推荐阅读