gpt4 book ai didi

javascript - vuejs2如何在输入聚焦时阻止表单提交并在失去焦点时启用它?

转载 作者:行者123 更新时间:2023-11-28 04:26:32 25 4
gpt4 key购买 nike

我正在开发一个带有 vue 组件的表单,该组件具有自动完成功能,我想让用户从建议中进行选择。我正在处理向上、向下和输入的按键事件。不幸的是,当按下回车键时,表单就被提交了。如果输入字段获得焦点,我想阻止表单提交。我尝试在表单标签中使用 v-on:submit.prevent ,但这会完全禁用表单提交,我需要创建一个单独的表单提交函数。

最佳答案

你可以这样做。但我不太了解 vue,所以我可能是错的。

window.onload = function() {
new Vue({
data() {
return {
focused: false
}
},
methods: {
onSubmit: function() {
return this.focused;
}
}
}).$mount('#app')
}
<html>

<head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.4/vue.js"></script>
</head>

<body>
<div id="app">
<form v-on:submit="onSubmit">
<input type="text" @focus="focused = true" @blur="focused = false" />
<button :disabled="focused">Submit</button>
</form>
</div>

</body>

</html>

关于javascript - vuejs2如何在输入聚焦时阻止表单提交并在失去焦点时启用它?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45007450/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com