代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
body {
padding: 50px;
}
.container {
padding: 40px 80px 15px 80px;
background-color: #fff;
border-radius: 8px;
max-width: 800px;
}
.heading {
text-align: center;
}
.btn {
outline: none !important;
color:white;
}
.btn.btn-primary {
background-color: #5c4084;
border-color: #5c4084;
outline: none;
}
.btn.btn-primary:hover {
background-color: #442f62;
border-color: #442f62;
}
.btn.btn-primary:active, .btn.btn-primary:focus {
background-color: #684895;
border-color: #684895;
}
.btn.btn-primary .fa {
padding-right: 4px;
}
.form-group {
margin-bottom: 25px;
text-align: left;
}
</style>
</head>
<body translate="no">
<div class="container" id="app">
<div class="form-group">
<input type="text" class="form-control" ref="search" placeholder="Focus On Me" />
</div>
<div class="form-group">
<button type="button" class="btn btn-primary btn-block" @click="setFocus()">Set Focus</button>
</div>
</div>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue@2.6.1.js"></script>
<script>
new Vue({
el: '#app',
data: {},
methods: {
setFocus: function () {
// Note, you need to add a ref="search" attribute to your input.
this.$refs.search.focus();
}
}
});
</script>
</body>
</html>
网友回复
有没有开源的项目将图片视频声音文字转场特效编排自动生成剪映草稿json文件?
有没有摄像头捕获眼球转动操作鼠标的开源代码?
localstorage如何生成自增的键值对进行增删改查?
python有没有将python脚本与python运行环境一键打包成exe的代码?
nodejs如何执行浏览器中运行的js代码?
iframe中如何阻止其他域名网页的打开或跳转?
webrtc如何实现多人音频电话会议?
如何实现uni.connectSocket兼容web与小程序app端的websocket通讯?
webrtc如何浏览器中实现多人群音视频通话会议?
indexdb中的表结构与数据如何导出导入恢复?