javascript 无法从“HTMLInputElement”读取“selectionStart”属性:

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/34033122/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 17:09:29  来源:igfitidea点击:

Failed to read the 'selectionStart' property from 'HTMLInputElement':

javascriptjqueryknockout.js

提问by diy

I'm using binding handler.if i remove this code my code is saved.but if i use this code it will throw error.

我正在使用绑定处理程序。如果我删除此代码,我的代码将被保存。但如果我使用此代码,它将引发错误。

Uncaught InvalidStateError: Failed to read the 'selectionStart' property from 'HTMLInputElement': The input element's type ('checkbox') does not support selection.

未捕获的 InvalidStateError:无法从“HTMLInputElement”读取“selectionStart”属性:输入元素的类型(“复选框”)不支持选择。

 ko.bindingHandlers.wysiwyg = {
        init: function (element, valueAccessor, allBindingsAccessor) {
            debugger;
            var options = allBindingsAccessor().wysiwygOptions || {};
            var value = ko.utils.unwrapObservable(valueAccessor());

                    //value = value.text();
            //var v = value[0].childNodes[0].data;
            var $e = $(element);

            $.extend(true, {
                initialContent: value
            }, options);

            $e.wysiwyg(options);

            //handle the field changing
            function detectFn() {
                var observable = valueAccessor();
                var newvalue = $e.wysiwyg("getContent");
                observable(newvalue);
            }

            var current = $e.wysiwyg('document');
            var timer;
            current.bind({
                keyup: function () {
                    clearTimeout(timer);
                    timer = setTimeout(detectFn, 1000);
                }
            });

            //handle disposal (if KO removes by the template binding)
            ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
                $e.wysiwyg('destroy');
            });


        },
        update: function (element, valueAccessor) {
            var value = ko.utils.unwrapObservable(valueAccessor());

            $(element).wysiwyg("setContent", value);
            ko.bindingHandlers.value.update(element, valueAccessor);
        }
    };

回答by pixelistik

You have an inputelement of type="checkbox"in your HTML, where the Javascript code expects a type="text".

您的 HTML 中有一个input元素type="checkbox",其中 Javascript 代码需要一个type="text".

A checkboxhas no text, thus it cannot have any selection. But your code tries to access the non-existent property selectionStart.

Acheckbox没有文本,因此它不能有任何选择。但是您的代码尝试访问不存在的属性selectionStart

Please have a look at https://jsfiddle.net/u99f0q1j/to see the issue demonstrated.

请查看https://jsfiddle.net/u99f0q1j/以查看演示的问题。

As you did not post your HTML, it is hard to see what is causing the error.

由于您没有发布 HTML,因此很难看出是什么导致了错误。

But in your browser dev tools, you should be able to click on the line number next to your "Uncaught InvalidStateError" message in order to see the Javascript line that tried to access the selectionStartproperty on your checkbox.

但是在您的浏览器开发工具中,您应该能够单击“Uncaught InvalidStateError”消息旁边的行号,以便查看尝试访问selectionStart复选框上的属性的 Javascript 行。

回答by awj

There are some DOM elements whose value cannot be obtained by using jQuery's .val()or the DOM's .value. One example is the HTML5 numberfield; another is the checkbox.

有一些 DOM 元素的值无法通过使用 jQuery.val()或 DOM 的.value. 一个例子是 HTML5number字段;另一个是复选框。

I'm not certain wherethis exception is occurring - you can easily find out by commenting-out lines in your binding handler and using trial-and-error. I could copy your binding handler into a test page but I don't know what HTML you're binding it to. However, I suspect you'll find that you have to do some element-type checking, and implement different logic for different types of DOM element.

我不确定这个异常发生在哪里- 您可以通过在绑定处理程序中注释掉行并使用反复试验来轻松找到。我可以将您的绑定处理程序复制到测试页中,但我不知道您将其绑定到什么 HTML。但是,我怀疑您会发现您必须进行一些元素类型检查,并为不同类型的 DOM 元素实现不同的逻辑。

My suggestion would be to change your initfunction to

我的建议是将您的init功能更改为

init: function(element, valueAccessor, allBindingsAccessor) {
    var options = allBindingsAccessor().wysiwygOptions || {},
        value = ko.utils.unwrapObservable(valueAccessor());

    /*
        the rest of your init function, commented-out
    */
}

Verify that this doesn'tthrow an exception, then gradually uncomment the remaining script, block by block, reloading your page after each modification until you find the cause of the exception.

验证这不会引发异常,然后逐步取消对剩余脚本的注释,逐块,每次修改后重新加载页面,直到找到异常的原因。

回答by Ramila

$.ajax({
        processData: false,
        contentType: false,
        type:"POST",

add processData =falseand contentType = false. This works for me.

添加processData =falsecontentType = false。这对我有用。