Question

button 按钮如何触发input焦点事件

<form id="edit-profile" action="{% url 'UploadMulti:UploadMulti_typeupdate' user.ChannelID %}" class="form-horizontal" method="post" target="the_iframe">
{% csrf_token %}
<div class="control-group">
<label class="control-label" for="input01">类别：</label>
<div class="controls">
<input type="text" name="ChannelName" class="input-xlarge" id="i1" value="{{ user.ChannelName }}" />
<span class="error" id="s1" style="color:red;" ></span>

</div>
</div>
<div class="form-actions">
<button type="submit" id="s3" class="btn btn-primary" onclick="javascript:return confirm('确认修改？'); setFocus() ">保存</button> <button type="reset" class="btn">重置</button>
</div>
</form>
<script language="JavaScript" type="text/javascript">
{# 当光标移出input输入框后， #}
$('#i1').on('blur',function () {
$('#s1').text('');
{# 获得input框内的输入内容 #}
var ChannelName = $(this).val();
$.ajax({
url:'/UploadMulti/typeupdate/',
type:'POST',
data:{ChannelNames:ChannelName},
success:function (data) {
console.log(data);
if (data.code){
// 类别名称已存在！
$("#s1").text(data.msg);
}
}
})
});

Answer 1

只要给按钮设置 mousedown 事件，并在其中 event.preventDefault() 就可以了

// html<input type="text" autofocus="autofocus"><button>点击我文本输入框不会失去焦点</button>// javascriptvar btn = document.querySelector('button')
btn.onmousedown = function(event) {event.preventDefault()}