- xml - AJAX/Jquery XML 解析
- 具有多重继承的 XML 模式
- .net - 枚举序列化 Json 与 XML
- XML 简单类型、简单内容、复杂类型、复杂内容
我正在构建一个韩语词汇训练器,我想将用户输入与人们输入的内容进行比较。
在韩语和其他一些亚洲语言中,您可以通过多个按键事件来组合字母。在 Chrome 中,$scope.$watch、ng-keyup 和 ng-change 仅在字母完全组成并输入新字母或空格后才会触发。我不介意 AngularJS 在最后一个字母完全组成之前不会触发任何东西,但是一旦字母完成,它应该触发而不必添加空格或开始下一个单词。
HTML:
<form name="forms.vocabularyForm">
<input name="answer" id="answer" ng-model="vocabularyCtrl.answer" ng-change="vocabularyCtrl.checkChange()" ng-keyup="vocabularyCtrl.checkKeyUp($event)" type="text" />
</form>
Controller :
.controller('VocabularyCtrl', [
'$scope',
'$location',
function($scope, $location) {
this.checkChange = function () {
console.log("answer change: " + this.answer);
};
this.checkKeyUp = function ($event) {
console.log("answer keyUp: " + this.answer);
};
$scope.$watch('vocabularyCtrl.answer', function (answerNew, answerOld) {
console.log('answerOld: ' + answerOld + ', answerNew: ' + answerNew);
}, true);
};
]);
例子:
Input: ㄱ
Console:
answerOld: , answerNew:
answer keyUp:
Input: 가
Console:
answerOld: , answerNew:
answer keyUp:
Input: 감 (character is now fully composed)
Console:
answerOld: , answerNew:
answer keyUp:
Input: 감ㅅ (starting the next character, same behaviour with space bar)
Console:
answerOld: 감, answerNew:
answer change: 감
answer keyUp: 감
最佳答案
正如 Angular 团队的一位乐于助人的成员所解释的那样,在组合 Angular 色时所有触发器都被有意抑制。更多详情 here .
按照建议,我创建了一个自定义指令,在编写字符时手动更新模型:
指令:
(function() {
'use strict';
angular.module('myApp', [])
// Angular's ng-change, ng-keyup and $scope.$watch don't get triggered
// while composing (e.g. when writing Korean syllables).
// See: https://github.com/angular/angular.js/issues/10588
// This custom directive uses element.on('input') instead, which gets
// triggered while composing.
.directive('cstInput', function() {
return {
restrict: 'A',
require: '^ngModel',
scope: {
ngModel: '=', // sync model
},
link: function (scope, element, attrs, ngModel) {
element.on('input', function() {
scope.ngModel = element.val();
});
}
};
});
})();
Controller :(按照 ippi 的建议)
$scope.$watch('quizzesCtrl.answer', function (answer) {
console.log(answer);
});
HTML:
<form ng-controller="QuizzesController as quizzesCtrl">
<input cst-input name="answer" id="answer" ng-model="quizzesCtrl.answer" type="text" />
</form>
更新
我必须将代码更改为以下代码才能使其在 FireFox 中工作(Chrome 和 Safari 可以很好地使用上面的代码)。
指令:
(function() {
'use strict';
angular.module('myApp', [])
// Angular's ng-change, ng-keyup and $scope.$watch don't get triggered
// while composing (e.g. when writing Korean syllables).
// See: https://github.com/angular/angular.js/issues/10588
// This custom directive uses element.on('input') instead, which gets
// triggered while composing.
.directive('cstInput', function() {
return {
restrict: 'A',
require: '^ngModel',
link: function (scope, element, attrs, ngModel) {
element.on('input', function() {
scope.$apply(function(){
scope.ngModel = element.val();
scope.$eval(attrs.cstInput, {'answer': scope.ngModel}); // only works if no scope has been defined in directive
});
});
}
};
});
})();
Controller :
this.checkAnswer = function (answer) {
if (answer === this.quiz.answer) {
this.isCorrect = true;
}
};
HTML(注意任何传入的参数都需要在 cst-input-callback 中列出):
<form ng-controller="QuizzesController as quizzesCtrl">
<input cst-input="quizzesCtrl.checkAnswer(answer)" ng-model="quizzesCtrl.answer" name="answer" id="answer" type="text" />
</form>
关于javascript - AngularJS:在编写韩文字符时触发 ng-change、ng-keyup 或 $scope.$watch,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27663149/
我创建了一个 keyup() 函数,代码在这里 $(document).ready(function() { var scntDiv = $('#add_words'); var wo
我希望它只在 keyup 而不是之前触发。有人可以帮忙吗? $(function() { $('#acf-field_5a32085c7df98-field_5a3208f87df99').on('k
在 Chrome 30.0.1599.101 和 IE 11 中,输入选择器无法在 Firefox 25.0.1 中正常工作 在 Chrome/IE 中损坏: $(document).ready(fu
在我为工作而构建的网站上,我们有一个搜索栏,用户可以在其中输入内容以搜索存储在一组元素数据中的各个字段。当他们开始输入时,问题出现在较慢的浏览器中。 我尝试做的是以下操作,使用 jQuery Defe
我正在尝试使用 vanilla js 编写一些简单的东西来在用户按下回车键时触发一个函数。我在下面找到了一些代码,但我不确定如何让它工作,因为该函数没有名称。 function (event) {
场景如下: 我有一个内容可编辑的 div。我还有一个文本区域,其中 .keyup() 上发生了一些事情。 我需要这样,在content editable div的keyup()上,将contented
有一个输入文本会在“onkeyup”事件上触发一个函数。当该函数触发时,我将使用 .on("keyup") 方法绑定(bind)一个“keyup”事件,以获取最后按下的键以查明它是否是字母数字,以便触
我想知道如何对同一个 #id 执行 .keyup() 和 .click() ? 即本质上,我想在用户尝试点击 enter 或点击 #search 按钮时验证 #id 。 非常感谢 最佳答案 $('#f
我必须在这里使用jquery keyup来检测用户是否输入任何文本,但我的问题是如果用户使用鼠标粘贴文本,它将无法检测到它,你能告诉我原因吗? 这是我的源代码: $("textarea").keyup
我正在尝试创建一个输入字段,用户只能在其中输入数字。这个功能对我来说已经可以正常工作了: $('#p_first').keyup(function(event){ if
我正在尝试编写类似于“占位符”polyfill 的内容。我想捕获输入字段上的 keyup 事件并获取用户输入的字符,所以我有以下代码: $elem.on('keyup',function(e){
我想我已经弄清楚了......请参阅我的评论。抱歉。 我有一个 JSON Web 服务,它在某个 keyup() 事件上调用,该事件根据输入检索一些数据。我想在输入任何内容之前加载一组初始数据。我正在
所以我使用 Keyup 来计算输入字段的总数。到目前为止,一切都很好。但现在我想这样做:如果选中#a 复选框,则将总金额加 12。如果没有,则添加 0。 我的代码基于此:http://jsfiddle
我在弄清楚为什么 keyup 事件在以下情况下不起作用(不显示警报)时遇到问题,我对表单使用 bootstrap 3,但我不认为 form-control取消键盘输入? HTML: jQuery:
我正在构建一个搜索表单,.keyup 中的 ajax 函数可以有不同的参数,我想通过检查是否存在另一个值来检查是否需要包含此参数。这是我现在拥有的: var delay = (function() {
我的 html 和 jquery 代码 Insert title here td { min-height: 50px; min-width: 50px; }
每次我按下键盘上的一个键,它都会将 $(this).val(""); 设置为 null,并且 score 变量将为 -2 . initialize: function() { var scor
我是 javascript 及其事件的新手。这是我的表格 html 代码,其中有收入标题及其各自的价格。 sn Title of income
我有一个这样的表: 当数量/价格变化小计也发生变化时,我想制作Javascript。我的js: $("#invoice_item").delega
我正在 js 中制作字符计数器,但 keyup 事件不起作用??? $(document).ready(function() { function countingCharacter(elemen
我是一名优秀的程序员,十分优秀!