输入文本输入元素的文本在什么时候成为输入的值？

Question

我的问题是： 在什么时候输入HTML文本输入字段的文字会成为该输入字段的值？

我应该注意到我试图解决的问题是偶然的（尽管为了上下文我已将其包含在下面）。

在尝试解决这个问题的过程中，我意识到我需要更广泛地理解究竟发生了什么，因此我的问题更为笼统。我无法找到任何文档来解释在文本字段（或任何接受文本输入的HTML对象）中输入的文本在什么时候成为该对象的一部分（作为值等）。

我试图解决的附带问题：

我在页面上有一堆input[type='text']个字段。有些字段预先填充了值，有些字段有空值（value=''）。

我有一个脚本可以阻止用户删除或调整预填充字段中的文本，但允许他们在空字段中输入文本。

然而，一旦用户离开＆＃34;一个字段，即字段外的点击，输入的文字不再可编辑，即使该字段的值似乎没有更新（至少就我在Chrome开发者工具中看到的那样）< / strong>即可。对我来说，这表明输入的文本已成为该字段的值？但如果是这种情况，为什么Chrome Dev Tools不反映这一点？

HTML：

<form id="group-email-form">

    <input type="text" value="test1@test.com">

    <input type="text" placeholder="Email Address 2" value="">

</form>

jQuery的：

$('#group-email-form input').on('focus', function() {

    var myValue = $(this).val();

    console.log(myValue);

    if ( myValue == '' ) {

        console.log('input has empty value');

    }

    else {

        console.log('input has a value');

        $(this).keydown( function (e) {

            var keyCode = e.keyCode || e.which;

            if ( keyCode == 9 ) {

            }

            else {

                return false;

            }

        });

    }

});

Answer 1

如果您希望文本框不可编辑;使用readonly属性。

<input type='text' readonly>

这样，它的受保护（有时仍然可以使用开发工具进行更改），但也可以通过<form>传递

Answer 2

我正在回答这个问题，因为相关信息已经在评论中以片段形式给出，但不作为正式答案。 （感谢@zzzzBov和@DonBhrayanSingh - 谢谢。）

输入到输入文本字段的文本将成为keypress或keyup上该输入的值。

一旦键盘信号到达DOM，它就会成为该输入值的一部分（尽管事实上这不会反映在Chrome开发者工具中 - 在“元素”或“属性”选项卡下）。换句话说，每次按下键时都会更新该值。

我仍然无法找到任何支持上述内容的官方文档（但我确实发现这个SO answer正在提及它。我希望这是由于我缺乏正确的术语，使我能够搜索和查找相关信息。

在我的特定情况下，我使用jQuery来阻止用户将文本输入到具有现有值的字段中，在预先填充的输入元素上使用readonly attibute是一种更优雅的解决方案。

Answer 3

// You can use the blur event to have something happen on leaving the 
// input field
$('input[type="text"]').on('blur', function(){
    /* if you want to write any condition you may write here before 
    declaring it as read only */
    $(this).attr('readonly', 'true')
})