当输入获得/失去焦点时,有没有办法在模型中更改值?
此处的用例是一个搜索输入,在您键入时显示结果,这些只应在焦点位于搜索框时显示.
这是我到目前为止所拥有的:
<input type="search" v-model="query">
<div class="results-as-you-type" v-if="magic_flag"> ... </div>
Run Code Online (Sandbox Code Playgroud)
然后,
new Vue({
el: '#search_wrapper',
data: {
query: '',
magic_flag: false
}
});
Run Code Online (Sandbox Code Playgroud)
这里的想法magic_flag应该是true在搜索框具有焦点时转向.我可以手动执行此操作(例如,使用jQuery),但我想要一个纯粹的Vue.JS解决方案.
当我想在屏幕打开时做一些动作时,我把它们放在componentDidMount中.例如,我可以获取一些数据.
像这样.
componentDidMount() {
this.updateData();
}
Run Code Online (Sandbox Code Playgroud)
但是反应导航componentDidMount只在用户第一次打开屏幕时出现一次,如果以后用户再次打开此页面则不会触发componentDidMount.
检测页面(屏幕)何时被激活并执行操作的正确方法是什么?
onfocus viewdidappear viewwillappear react-native react-navigation
我正在尝试调试附加到页面上一堆文本框的JavaScript onFocus事件.选择文本框然后跳转到下一个文本框时会出现错误.我正在尝试通过使用Chrome开发工具在onFocus事件中放置一个断点来调试此问题.我面临的问题是,当我选择一个文本框并且捕获断点时,Chrome开发工具会窃取焦点并且不会返回它,因此我无法选中下一个文本框.任何人都有想法解决问题?我想我可以使用警报语句打印我需要的所有信息,而无需使用Chrome开发工具......
我发现当连接到窗口,文档或正文时,javascript焦点和模糊事件在Android浏览器上无法正确触发.
我想要一个在桌面浏览器上正常工作的简单测试脚本,但在Android股票浏览器,Dolphin和Opera mobile上都失败了:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
<title>Focus test</title>
<script type="text/javascript">
window.onfocus = function() {
document.getElementById('console').innerHTML += '<div>Focus event handler fired.</div>';
};
window.onblur = function() {
document.getElementById('console').innerHTML += '<div>Blur event handler fired.</div>';
};
</script>
</head>
<body>
<input id="test" name="test" />
<div id="console"></div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
有趣的是,如果表单输入正在获得焦点,则事件处理程序将触发,并且在模糊时,模糊事件处理程序将触发两次.
有没有人有一个很好的解决方案或解决方法?
编辑:预期的结果是,如果我更改浏览器选项卡,或更改为另一个应用程序,模糊事件应该触发,如果我回到浏览器选项卡,焦点事件应该触发(这是它在桌面上的工作原理) )
好的,今天我正在制作一个帮助HTML功能.它看起来像这样:
function Input($name,$type,$lable,$value= null){
if (isset($value)) {
//if (this.value=='search') this.value = ''
echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" value="'.$value.'" onfocus="if (this.value==\''.$value.'\') this.value = \'\' "/>';
}
if (!isset($value)) {
echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" />';
}
}
Run Code Online (Sandbox Code Playgroud)
如您所见,如果您插入一个值,它将执行一些JavaScript,以便当我单击该框时,框内的文本将消失,
问题:当我们没有输入时,我们如何才能使它具有价值?(请查看stackoverflow上的搜索框,但是我们没有指向输入框后,stackoverflow上的搜索框没有回来?也许是通过使用onblur?我是对的吗?
希望你明白我的意思.
好吧因为有些人没有得到我的意思,请看
当我没有点击它.
alt text http://img39.imageshack.us/img39/4128/48048759.png
当我点击它.
alt text http://img691.imageshack.us/img691/4485/94918020.png
当我不再点击它.
alt text http://img691.imageshack.us/img691/4485/94918020.png
它应该是
当我没有点击它.
alt text http://img39.imageshack.us/img39/4128/48048759.png
当我点击它.
alt text http://img691.imageshack.us/img691/4485/94918020.png …
我需要一些帮助来找到一个jQuery插件,它允许我从选择的图像列表中显示图像预览 - onfocus/onchange ..
例:
<select name="image" id="image" class="inputbox" size="1">
<option value=""> - Select Image - </option>
<option value="image1.jpg">image1.jpg</option>
<option value="image2.jpg">image2.jpg</option>
<option value="image3.jpg">image3.jpg</option>
</select>
<div id="imagePreview">
displays image here
</div>
Run Code Online (Sandbox Code Playgroud)
有没有人遇到这样的事情?我试过寻找它无济于事..
谢谢!
我有一个输入框,其中分配了默认值文本.当用户关注字段时,如何删除此文本::
码
<input type="text" name="kp1_description" value="Enter Keypress Description">
Run Code Online (Sandbox Code Playgroud) 每当用户点击选项卡时,我都可以注册该事件,这意味着他们在我的页面选项卡上,单击另一个选项卡,然后返回到我的选项卡.
编辑: 通过选项卡,我的意思是浏览器选项卡,而不是jQueryUI选项卡.
当我在文本框的焦点上时,我正试图将光标设置到开头的位置.这就是我所拥有的:
$("ID").focus(function () {
var input = this;
setTimeout(function() {
input.setSelectionRange(0, 0);
}, 0);
});
Run Code Online (Sandbox Code Playgroud)
但是每次我尝试加载脚本时都会收到此错误:
未捕获的InvalidStateError:无法在'HTMLInputElement'上执行'setSelectionRange':输入元素的类型('email')不支持选择.
猜猜我不能用setSelectionRange在电子邮件上.那么,关于如何在输入文本框中设置光标位置的任何其他解决方案(不更改类型电子邮件)?
Hai Guys,我想将光标设置在文本框上长度为14的位置,该文本框没有值..我知道最初光标将为0我希望它在14