vue使用element-ui的el-input监听不了回车事件解决

vue使用element-ui的el-input监听不了回车事件,原因应该是element-ui自身封装了一层input标签之后,把原来的事件隐藏了,所以如下代码运行是无响应的:

<el-input v-model="form.loginName" placeholder="账号" @keyup.enter="doLogin"></el-input>

解决方法需要在事件后面加上.native

<el-input v-model="form.loginName" placeholder="账号" @keyup.enter.native="doLogin"></el-input>

以上内容转载自_小小黑(vue使用element-ui的el-input监听不了回车事件解决)


需求*:*在项目中常会遇到搜索框,一般情况下搜索内容输入完毕后点击搜索按钮来进行相关搜索,但是用户已经形成了习惯性,当输入完成后点击回车键来代替点击搜索按钮!

实现原理:输入框点击回车按钮时触发搜索按钮点击事件

$("input").keydown(function (e) {//当按下按键时
    if (e.which == 13) {//.which属性判断按下的是哪个键,回车键的键位序号为13
        $('button.searchBtn').trigger("click");//触发搜索按钮的点击事件
    }
});

以上内容转载自夏天的甲虫(搜索框点击回车键触发搜索按钮点击事件)

<div class="search_content">
    <input id="keyword" type="text" placeholder="请输入你要搜索的宝贝ID、宝贝链接或关键词">
    <a href="javascript:void(0);" class="submit">搜全站</a>
</div>
---------------------------------------------------------------------------
$('#keyword').bind('keypress', function(event) {
     if (event.keyCode == "13") { 
        $(".submit").click(); 
    }
 });

了解一下bind函数??

猜你喜欢

转载自blog.csdn.net/love_parents/article/details/81940283