javascript - 在 mvc3 中 @Html.TextboxFor 的 onchange 事件上更改标签文本

Question

我正在使用 MVC3 Razor。我想在@Html.TextboxFor 的 onchange 事件上更改标签的文本。

这是我正在尝试的代码：

在视图中：

@Html.TextBoxFor(x => x.ItnScanCaseCode, new { @onchange = "event();" })

JavaScript：

function event() {
    document.getElementById('lblSelectedProductName').value ="sam";
}

但它不起作用。

Answer 1

使用这个 jquery 语法它工作正常。

@Html.TextBoxFor(x => x.ItnScanCaseCode, new { @id="txtid",@onchange = "onchangeevent();" })

function onchangeevent(){
        $('#txtid').val('sam');
    }

Answer 2

这可以通过 JavaScript 完成，但我更喜欢使用jQuery. 我喜欢将我的 HTML 和 JavaScript 分开，而是在所有控件都加载到 DOM 后监听 on change 事件。

文本框的 HTML 标记可能看起来像这样。我添加了自己的标签元素用于测试目的。

<input id="ItnScanCaseCode" name="ItnScanCaseCode" type="text" value="" />
<label id="lblSelectedProductName">Test Label Text</label>

以及用于添加 on change 事件侦听器的 jQuery 脚本：

$(document).ready(function () {
     $('#ItnScanCaseCode').change(function () {
          $('#lblSelectedProductName').text('sam');
     });
});

如果您需要将此标签文本更改为单独的函数方法，请这样做，但上述方法对我来说已经足够了。

$(document).ready(function () {
     function yourEventMethod() {
          $('#lblSelectedProductName').text('sam');
     };

     $('#ItnScanCaseCode').change(function () {
          yourEventMethod();
     });
});

我希望这有帮助。

Answer 3

问题在于事件名称尝试使用不同的事件名称它将起作用。

@Html.TextBoxFor(x => x.ItnScanCaseCode, new { @onchange = "onchangeevent();" })

function onchangeevent(){
        document.getElementById('lblSelectedProductName').value ="sam";
    }

问候

Answer 4

你可以试试这个

  @Html.TextBoxFor(model => model.Image, new { type = "file",
                       @onchange = "show(this);" })

我的 JavaScript 在哪里

<script type="text/javascript">

   function show(input) {
      if (input.files && input.files[0]) {
      var filerdr = new FileReader();
      filerdr.onload = function (e) {
         $('#user_img').attr('src', e.target.result);
      }
      filerdr.readAsDataURL(input.files[0]);
   }
}
</script>