[英]Difference in js native .value vs jQuery .val()
我有一个关于JavaScript本机element.value与jQuery $(element).val();的区别的快速问题。
我已经在AngularJS中创建了BB编辑器,这就是我的问题所在。
这是我的指令的代码:
bbApp.directive('bbEdit', function() {
return {
restrict: 'A',
templateUrl: 'tpl/editor.html',
link: function(scope) {
scope.tagType = '';
var el = document.querySelector('#bbeditor');
scope.wrap = function(type) {
scope.tagType = type;
var str = el.value.toString();
var selection = str.slice(el.selectionStart, el.selectionEnd);
if( scope.noWrapTags.indexOf(scope.tagType) == -1 && selection == "" ) {
alert('Please select text to format');
return false;
}
if( scope.allowedTags.indexOf(scope.tagType) == -1 ) {
alert('Sorry, that formatting option is not available');
return false;
}
var strArr = str.split("");
if( scope.noWrapTags.indexOf(scope.tagType) != -1 ) {
strArr.splice(el.selectionStart,selection.length, "["+ scope.tagType +"]");
} else {
strArr.splice(el.selectionStart,selection.length, "["+ scope.tagType +"]"+selection+"[/"+ scope.tagType +"]");
}
el.value = strArr.join("");
}
}
}});
我正在像这样访问元素: var el = document.querySelector('#bbeditor');
然后获取值: var str = el.value.toString();
但是,当我尝试使用jQuery的.val()执行此操作时,它无法正常工作。
该应用程序当前的编写方式将将所有突出显示的文本包装在适当的自定义bb标签中。
但是当我像这样访问textarea的值时:
var el = angular.element(element).find('textarea');
var str = el.val().toString();
我得到了文本值,但是我的字符串操作只是用bb标签包裹了textarea的整个值,而不是只包裹了用户突出显示的文本。
使用jQuery来解决问题是否值得? 我可以使用document.QuerySelector()吗?
我只是想使用Angular中可用的功能,显然我的指令中我可以访问element。 但是jQuery .val()与本机.value的工作方式不同。
任何解释/建议,将不胜感激。 我是Angular的新手。
我的应用程序正在运行,但是我只是想知道是否应该以其他方式进行此操作。
document.querySelector
返回匹配的第一个元素。 jQuery的.find
方法返回匹配元素的数组。
除此之外, .value
不会返回所选文本,您正在使用var selection = str.slice(el.selectionStart, el.selectionEnd)
来获取所选文本。
如果您的代码可以在javascript中使用,我将保持原样。 没有足够的理由将其转换为jQuery(IMHO)。 在这种情况下,您将找不到任何使事情变得极其简单的东西。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.