@Html.TextBoxFor文本更改事件

Question

我有一个如下的@Html.TextBoxFor：

@Html.TextBoxFor(u => u.SomeProperty, new { @class = "jtb", @id = "TrajName", placeholder = "Traj Name" })

现在，我想要实现的是，在输入新字符的同时，我想知道何时将新字符添加到此文本框中。此时，我想将按钮状态更改为活动状态。我尝试了blur和change event。但它只有在焦点改变时才会触发。

$(document).ready(function () {
    $('#TrajName').val("");
    $('#StartLocation').val("-Select Location-");
    $('#EndLocation').val("-Select Location-");

    document.getElementById("BtnAddTraj").disabled = true;

    $("#TrajectoryName").blur(function () {
        if ($('#TrajName').text != "")
            document.getElementById("BtnAddTraj").disabled = false;
        else
            document.getElementById("BtnAddTraj").disabled = true;
    });
});

我有一个场景，用户可以在输入一些文本(即光标仍然在文本框内，焦点不变)后直接尝试点击按钮。

那么，有没有什么事件会在添加角色时触发，而不是在焦点改变时触发？

Answer 1

您需要将事件处理程序绑定到keyup JavaScript事件。

此外，我建议您使用.prop来设置disabled属性。

请尝试以下操作：

@Html.TextBoxFor(u => u.SomeProperty, new { @class = "jtb", @id = "TrajName", placeholder = "Traj Name" }) 

 $("#TrajectoryName").keyup(function () {
    if ($('#TrajName').val() != "")
        $("#BtnAddTraj").prop('disabled',false);
    else
        $("#BtnAddTraj").prop('disabled',true);
});

另一种解决方案是触发TrajectoryName textbox的input事件。每当你的输入发生变化时，它就会触发。

$("#TrajectoryName").on('input',function () {
    if ($('#TrajName').val() != "")
        $("#BtnAddTraj").prop('disabled',false);
    else
        $("#BtnAddTraj").prop('disabled',true);
});