jquery模拟按下回车

最新推荐文章于 2024-10-14 15:38:34 发布

转载最新推荐文章于 2024-10-14 15:38:34 发布 · 190 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/wujie6166/archive/2011/09/20/2182452.html

文章标签：

#javascript #json #ViewUI

众所周知easyui 的Pagination中要想跳转到某一页，只需要输入页码按ENTER就能达到效果。前段时间的项目客户提出要求说想要输入页码按一个GO的按钮做跳转。好吧，客户是上帝，他们怎么说我们这些程序猿只能尽自己所能来达到效果。如图：

即：按下GO做输入3按回车一样的事情

而这个问题可以简化为点击一个a标签模拟Pagination页码输入框按下回车但是这个事件是写在jquery.easyui.min.js中,我们没有办法直接调用；通过chrome查询到页码输入框是

<input class="pagination-num" type="text" value="1" size="2">

而后查看了JQUERY API 的 Event Object发现 jquery有个trigger方法能够触发模拟的按键事件。直接上代码

<script language="javascript" type="text/javascript">
    $(document).ready(function () {
    $("#test").datagrid({
            url: "/Test/Test1Data",
            type: "post",
            datatype: "json",
            width: 465,
            height: 280,
            loadMsg: "数据加载中，请稍后...",
            fitCloumns: true,
            nowrap: true,
            rownumbers: false,
            pagination: true,
            singleSelect: true,
            showFooter: true,
            columns: [[
                    { field: 'testName', title: '测试名', width:230, editor: 'text'},
                    {field:'testValue',title:'测试值',width:230,align: 'center' }
                    ]]
        });
        $("#test").datagrid('getPager').pagination({
            showPageList: false,
            showRefresh: false,
            beforePageText: "第",
            afterPageText: "页 <a href='javascript:void(0)' onclick='GoEnterPage()'><img src='http://www.cnblogs.com/Content/themes/icons/Go_.gif'></a>，共{pages}页",
            displayMsg: '当前{from}到{to}条，总共{total}条'
        });
    }); //上面代码参数可以参看easyui的文档
    function GoEnterPage() {
var e = jQuery.Event("keydown");//模拟一个键盘事件
        e.keyCode = 13;//keyCode=13是回车
        $("input.pagination-num").trigger(e);//模拟页码框按下回车
    }
</script>