jquery之onchange事件

$(function(){
  $("#opreateHtml").window("close");

  $("#deliveryGrid").datagrid({
    url:appPath+"/page/signActivityAct/getPage",
    height:"full",
    striped:true,
    remoteSort:false,
    pagination:true,
    rownumbers:true,
    singleSelect:false,
    queryParams:getQueryParam(),
    frozenColumns:[[{field:"ck",checkbox:true},
      {field:"opt",title:"操作",width:100,align:"center",
        formatter:function(value,rowData,rowIndex){
            var dataStr = JSON.stringify(rowData);
            var html = "";
            if(rowData.isdisable=='N'&& rowData.isdisable!='Y'){
//                html += "<img class='op-enable' src='"+ appPath+ "/js/lib/jquery-easyui/themes/icons/cancel.png' onClick='deletes("+ rowData.signActivityId+ ")' title='停用'/>&nbsp;&nbsp;";
                html += "<img class='op-enable' src='"+ appPath+ "/js/lib/jquery-easyui/themes/icons/cancel.png' onClick='doOk("+ rowData.signActivityId+  "," + 2 + ")' title='禁用'/>&nbsp;&nbsp;";
            }else if(rowData.isdisable!='N'){
              html+="<img class='op-enable' src='"+appPath+"/js/lib/jquery-easyui/themes/icons/pencil.png' onClick='showWin("+dataStr+")' title='编辑'/>&nbsp;&nbsp;";
//              html+="<img class='op-enable' src='"+appPath+"/js/lib/jquery-easyui/themes/icons/get-verify.png' onClick='isOpen("+rowData.signActivityId+")' title='启用'/>&nbsp;&nbsp;";
              html+="<img class='op-enable' src='"+appPath+"/js/lib/jquery-easyui/themes/icons/get-verify.png' onClick='doOk("+rowData.signActivityId+"," + 1 + ")' title='启用'/>&nbsp;&nbsp;";

            }

          html += "<img class='op-enable' src='"+ appPath+ "/js/lib/jquery-easyui/themes/icons/search.png' onClick='showWin("+ dataStr+ ","+1+")' title='查看'/>&nbsp;&nbsp;";
            return html;
        }
      }
    ]],
    columns:[[
               {field:'startTime',title:'开始时间',width:100,align:'left',sortable:true},
               {field:'endTime',title:'结束时间',width:100,align:'left',sortable:true},
               {field:'rewardDays',title:'奖励期',width:100,align:'center',sortable:true},
               {field:'rewardName',title:'奖励产品',width:100,align:'center',sortable:true},
                {field : 'isdisable',
                title : '启用情况',
                width : 120,
                align : 'center',
                sortable : true,
                formatter : function(value, rowData, rowIndex) {
                    var strReturn = "";
                    if (rowData.isdisable == 'Y') {
                          return ("<font color=red> "+strReturn +"停用</font>");
                    } else if (rowData.isdisable == 'N') {
                         return ("<font color=green> "+strReturn +"启用</font>");
                    }else {
                        return ("<font color=black> "+strReturn +"新增</font>");
                    }

                }
            },

               {field:'editTime',title:'操作时间',width:120,align:'left',sortable:true}
   ]],
   toolbar:[
      {
          id:'btnadd',
          text:'新增签到活动',
          iconCls:'icon-add',
          handler:function(){
             showWin(null,null);
          }
      }

   ]
 });

  $("#addstartTime").datetimebox({
      onChange: function (n,o) {
        var bgAddTime = $('#addstartTime').datebox("getValue");
        var edAddTime = $('#addendTime').datebox("getValue");
        if(bgAddTime!=''&& bgAddTime!=null  && edAddTime!=''&&  edAddTime!=null){
            if(bgAddTime>edAddTime){
                $.messager.alert('提示', "开始时间不能大于结束时间", 'info');
                return;
            }
        }

        // 获取两个日期天数差
        var bgDates = new Date(bgAddTime);
        var edDates = new Date(edAddTime);
        var dayss = edDates.getTime() - bgDates.getTime();
        var rewardDayss= (parseInt(dayss / (1000 * 60 * 60 * 24)))+1;
        $("#addrewardDays").val(rewardDayss);
      }
  });

  //ji suan jie shu shi jian
  $("#addendTime").datetimebox({
      onChange: function (n,o) {
        var bgAddTime = $('#addstartTime').datebox("getValue");
        var edAddTime = $('#addendTime').datebox("getValue");
        if(bgAddTime!=''&& bgAddTime!=null  && edAddTime!=''&&  edAddTime!=null){
        if(bgAddTime>edAddTime){
            $.messager.alert('提示', "开始时间不能大于结束时间", 'info');
            return;
          }
        }
        // 获取两个日期天数差
        var bgDates = new Date(bgAddTime);
        var edDates = new Date(edAddTime);
        var dayss = edDates.getTime() - bgDates.getTime();
        var rewardDayss= (parseInt(dayss / (1000 * 60 * 60 * 24)))+1;
        $("#addrewardDays").val(rewardDayss);
      }
  });
});

function getQueryParam(){
  var signActivity =new Object();
  //封装查询条件
  signActivity.startTime = $("#startTime").datebox("getValue");
  signActivity.endTime = $("#endTime").datebox("getValue");
  signActivity.isdisable = $('#isdisable').combobox("getValue");
  return signActivity;
}

function doQuery(){
  $("#deliveryGrid").datagrid('load',getQueryParam());
}

function showWin(rowData,num){
    if(rowData!=null){
         $("#idHidden").val("");
          $("#addrewardDays").val("");
          $("#addplatform").val("");
          $("#addactivityIntroduction").val("");
//          $("#addrewardType").combobox("setValue", 'JF');//奖励类型  目前仅支持积分
          $("#addsignActivityId").val("");
          $("#addrewardName").val("");
          $("#addrewardContent").val("");
          $("#addstartTime").datebox("setValue","");
          $("#addendTime").datebox("setValue","");
          $("#isdisable").combobox("setValue", '');
          //签到规则说明
          var result=querySignRule();
          $("#addruleIntroduction").val(result);
          var iconStr = "icon-add";
            var title = "新增签到活动";
            var urlList;
            var id =rowData.signActivityId;
            if (id != null) {
                iconStr = "icon-edit";
                title = "编辑签到活动";
             $.post(
                appPath+"/page/signActivityAct/getBean/"+id,
                {},
                function(data){
                   $("#idHidden").val(data.signActivityId);
                   $("#addrewardDays").val(data.rewardDays);
                   $("#addplatform").combobox('setValue', data.platform);
                   $("#addactivityIntroduction").val(data.activityIntroduction);
                   $("#addrewardType").val(data.rewardType);

                   $("#addsignActivityId").val(data.signActivityId);
                   $("#addendTime").datebox("setValue", data.endTime);
                    $("#addstartTime").datebox("setValue", data.startTime);
                   $("#addrewardName").val(data.rewardName);
                   $("#addrewardContent").val(data.rewardContent);
                   $("#addisdisable").combobox('setValue', data.isdisable);
                },"json");
          }
    }else{
          var iconStr = "icon-add";
            var title = "新增签到活动";
          $("#idHidden").val("");

          $("#addrewardDays").val("");

          $("#addplatform").combobox("setValue", 'APP');
          $("#addactivityIntroduction").val("");
          $("#addrewardType").combobox("setValue", 'JF');//奖励类型  目前仅支持积分
          $("#addsignActivityId").val("");
          $("#addrewardName").val("签到额外奖励");
          $("#addrewardContent").val("");

          $("#addstartTime").datebox("setValue","");
          $("#addendTime").datebox("setValue","");

          $("#isdisable").combobox("setValue", '');
          //签到规则说明
         var result= querySignRule();
          $("#addruleIntroduction").val(result);
    }

  $('#opreateHtml').window({
    title:title,
    iconCls:iconStr,
    width : 750,
    height : 480,
    left : 200,
    modal : true,
    shadow : true,
    collapsible : false,
    minimizable : false,
    maximizable : false
  });
  $('#opreateHtml').window('move',{top:0});
  $('#opreateHtml').window('open');

  if(num==1){
        $("#shenheHideAndShow").hide();
    }else{
        $("#shenheHideAndShow").show();
    }
}

function closeWin(id){
  $('#opreateHtml').window('close');
}

function save(){
  var signActivity=new Object();
  if ($("#idHidden").val() != null && $("#idHidden").val() != "") {
      signActivity.signActivityId = $("#idHidden").val();
    }
    var bgAddTime = $('#addstartTime').datebox("getValue");
    var edAddTime = $('#addendTime').datebox("getValue");
    // 获取两个日期天数差
    var bgDate = new Date(bgAddTime);
    var edDate = new Date(edAddTime);
    var days = edDate.getTime() - bgDate.getTime();

    var rewardDays= (parseInt(days / (1000 * 60 * 60 * 24)))

  if($("#addstartTime").datebox("getValue")==""||$("#addstartTime").datebox("getValue")==null){
      $.messager.alert("提示","开始时间不能为空","info");
      return;
  }
  if ($("#addendTime").datebox("getValue") == null|| $("#addendTime").datebox("getValue") == "") {
        $.messager.alert('提示', "结束时间不能为空", 'info');
        return;
    }

    if ($("#addstartTime").datebox("getValue") >= $("#addendTime").datebox("getValue")) {
        $.messager.alert('提示', "开始时间不能大于结束时间", 'info');
        return;
    }

    if($("#addactivityIntroduction").val()==null || $("#addactivityIntroduction").val()==""){
        $.messager.alert('提示', "请输入活动的内容介绍", 'info');
        return;
    }
    if($("#addrewardName").val()==null ||$("#addrewardName").val()==""){
        $.messager.alert('提示', "请输入奖励积分名称", 'info');
        return;
    }
    if($("#addrewardContent").val()==null ||$("#addrewardContent").val()==""){
        $.messager.alert('提示', "请输入奖励积分分值", 'info');
        return;
    }

  signActivity.signActivityId = $("#idHidden").val();
  signActivity.startTime = $("#addstartTime").datebox("getValue");
  signActivity.endTime = $("#addendTime").datebox("getValue");

  signActivity.platform=$("#addplatform").combobox("getValue");

  signActivity.activityIntroduction=$("#addactivityIntroduction").val();

  signActivity.rewardType=$("#addrewardType").combobox("getValue");
  //默认是开始减去结束时间
  signActivity.rewardDays=rewardDays+1;

  signActivity.rewardName=$("#addrewardName").val();

  signActivity.rewardContent=$("#addrewardContent").val();

  //默认签到规则

  doAjax({
    url:appPath+'/page/signActivityAct/saveOrUpdate',
    type:'post',
    data:signActivity,
    success : function(data) {
        if (data == "ok") {
            $.messager.alert('提示', "保存成功", 'info');
            $('#opreateHtml').window('close');
            doQuery();
        } else {
            $.messager.alert('提示', data, 'info');
        }
    }
  });
}
function deletes(id) {
    var ids = '';
if (id == null || id == '') {
    var selections = $("#deliveryGrid").datagrid('getSelections');
    if (selections == null || selections == '') {
        $.messager.alert('提示信息', '请选操作的记录', '');
        return;
    }
    for (var i = 0; i < selections.length; i++) {
        ids += selections[i].signActivityId + ',';
    }
} else {
    ids = id;
}
$.messager.confirm('提示信息', "您确定要停用吗？", function(r) {
    if (r) {
        $.post(appPath + "/page/signActivityAct/deleteIdsLogic", {
            "ids" : ids
        }, function(data) {
            $.messager.alert('提示信息', '停用成功', '');
            doQuery();
        });
    }
});

}

//启用
function isOpen(id){

    var isdisable='Y';
    if(!checkIsisable(isdisable)){
        $.messager.alert('提示','数据中已经存在启用状态的活动,不可再启用！');
        return;
    }

    /**
     * 数据在启用的之前,应先查找数据库是否有已经启用的数据,
     * 保证后台数据只有一条是启用状态,否则弹框,并提示用户
     */
    var ids = '';
    if (id == null || id == '') {
        var selections = $("#deliveryGrid").datagrid('getSelections');
        if (selections == null || selections == '') {
            $.messager.alert('提示信息', '请选操作的记录', '');
            return;
        }
        for (var i = 0; i < selections.length; i++) {
            ids += selections[i].signActivityId + ',';
        }
    } else {
        ids = id;
    }
    $.messager.confirm('提示信息', "您确定要启用吗？", function(r) {
        if (r) {
            $.post(appPath + "/page/signActivityAct/isOpen", {
                "ids" : ids
            }, function(data) {
                $.messager.alert('提示信息', '启用成功', '');
                doQuery();
            });
        }
    });
}

//检查活动编码是否唯一
function checkIsisable(isdisable){
    var flag = false;
    doAjax({
        url:appPath+'/page/signActivityAct/checkIsdisable',
        type:'post',
        async:false,
        data:{
            isdisable:isdisable
        },
        success:function(data){
            if(data == 0){
                flag = true;
            }
        }
    });
    return flag;
}

/**
 * 通过soa-member 接口查询出默认签到规则
 */
function querySignRule(){
    var result='';
    doAjax({
        url:appPath+'/page/signActivityAct/getDeSignRule',
        type:'post',
        async:false,
        data:{},
        success:function(data){
         if(data!=null ){
             result=data[0].signRule
           return result;
         }
        }
    });

     return result;
}

/**
 * 启用,停用
 *
 */

function doOk(id,val){
    var msg = "";
    msg =  val ==1?"启用成功":"停用成功";
    doAjax({
        url: appPath + "/page/signActivityAct/onlineOrOffline",
        type: "post",
        dataType: "json",
        data: {id:id,isdisable:val} ,
        success: function (data) {
            doQuery();
            if(data=='1'){
               $.messager.alert('提示','数据中已经存在启用状态的活动,不可再启用！');
            }else{
            $.messager.alert('提示信息', msg, 'info');
            }
        },
        error: function () {
            alert('ajax异常');
        }
    });
}

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<jsp:include page="/jsp/common/header.jsp"></jsp:include>
<script src="${ctx }/js/signActivity/signActivity.js"></script>

<table class="queryTable">
  <tr>
    <td class="queryTitle" width="80px">开始时间</td>
        <td class="queryContent"><input class="inputText easyui-datetimebox" type="text" id="startTime"/></td>
        <td class="queryTitle" width="80px">结束时间</td>
        <td class="queryContent"><input class="inputText easyui-datetimebox" type="text" id="endTime"/></td>
    <td class="queryTitle" width="80px">启用状态</td>
    <td class="queryContent">
       <select id="isdisable" class="easyui-combobox" style="width: 100px" panelHeight="auto">
                <option value="">请选择</option>
                <option value="Y">禁用</option>
                <option value="N">启用</option>
        </select>
    </td>

    <td class="queryBtnTd" ><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-search"  onclick="doQuery()">查&nbsp;&nbsp;询</a></td>
  </tr>
</table>

<table id="deliveryGrid"></table>

<div id="opreateHtml" class="easyui-window" title="" iconCls="icon-edit" style="width:320px; height:550px;text-align:center; background: #fafafa;margin:0 auto;">
  <div class="easyui-layout" fit="true">
    <div region="center" border="false" style="background:#fff;border:1px solid #ccc;">
       <form>
           <input type="hidden" id="idHidden" name="idHidden" value="" />
           <table class="queryTable"  width="100%">
             <tr>
                   <td class="queryTitle" width="100px">开始时间</td>
                   <td class="queryContent" ><input class="inputText easyui-datetimebox" type="text" id="addstartTime" style="width:150px"/></td>
              </tr>
              <tr>
                   <td class="queryTitle" width="100px">结束时间</td>
                   <td class="queryContent" ><input class="inputText easyui-datetimebox" type="text" id="addendTime" style="width:150px"/></td>
               </tr>
               <tr>
                   <td class="queryTitle" width="100px">适用端</td>
               <td class="queryContent" >
                <select id="addplatform" class="easyui-combobox" style="width: 100px" panelHeight="auto">
                   <option value="APP">APP</option>
                   <option value="PC">PC</option>
                   <option value="WAP">WAP</option>
                </select>
             </td>
             </tr>
              <tr>
                 <td class="queryTitle" width="100px">内容介绍</td>
                    <td class="queryContent" colspan="20">
                <textarea id="addactivityIntroduction"  name="addactivityIntroduction" class="inputText" validType="maxLength[1000]" style="width: 565px;height:70px;"></textarea>
            </td>
              </tr>
              <tr>
                   <td class="queryTitle" width="100px">奖励类型</td>
                   <td class="queryContent" >
                    <select id="addrewardType" class="easyui-combobox" style="width: 100px" panelHeight="auto">
                   <option value="JF">积分</option>
                </select>
              </tr>
              <tr>
                   <td class="queryTitle" width="100px">奖励期</td>
                   <td class="queryContent" ><input class="inputText" type="text" id="addrewardDays"  value="" readonly="readonly" /></td>
               </tr>
               <tr>
                   <td class="queryTitle" width="100px">奖励积分名称</td>
                   <td class="queryContent" ><input class="inputText" type="text" id="addrewardName" /></td>
               </tr>
               <tr>
                   <td class="queryTitle" width="100px">奖励积分分值</td>
                   <td class="queryContent" ><input class="inputText" type="text" id="addrewardContent" /></td>
               </tr>

                <tr>
                   <td class="queryTitle"width="100px" >签到规则说明</td>

                   <td class="queryContent" colspan="30" >
                <textarea id="addruleIntroduction"  name="addruleIntroduction" class="inputText" validType="maxLength[1000]"  readonly="true" style="width: 565px;height:70px;"></textarea>
            </td>
               </tr>
           </table>
       </form>
    </div>
  <div region="south" border="false" style="text-align:center;height:30px;line-height:30px;">
  <label id="shenheHideAndShow">
     <a class="easyui-linkbutton" iconCls="icon-ok" href="javascript:void(0);" onclick="save('1');">确定</a>&nbsp;&nbsp;
   </label>
     <a class="easyui-linkbutton" iconCls="icon-cancel" href="javascript:void(0);" onclick="closeWin();">退出</a>
  </div>
</div>

</div>

总结:

 $("#addstartTime").datetimebox({
      onChange: function (n,o) {
        var bgAddTime = $('#addstartTime').datebox("getValue");
        var edAddTime = $('#addendTime').datebox("getValue");
        if(bgAddTime!=''&& bgAddTime!=null  && edAddTime!=''&&  edAddTime!=null){
            if(bgAddTime>edAddTime){
                $.messager.alert('提示', "开始时间不能大于结束时间", 'info');
                return;
            }
        }

        // 获取两个日期天数差
        var bgDates = new Date(bgAddTime);
        var edDates = new Date(edAddTime);
        var dayss = edDates.getTime() - bgDates.getTime();
        var rewardDayss= (parseInt(dayss / (1000 * 60 * 60 * 24)))+1;
        $("#addrewardDays").val(rewardDayss);
      }
  });

总结:

日期格式的插件是DatatimeBox,但是该插件没有事件方法,找到其依赖(即父类)databox,

只有一个onselect事件,不满足需要,再找到databox的父类combox,

找到onselect事件,满足需求,即:当文本域的值改变的时候触发。