文本框鼠标移出MVC中的Javascript

Posted 2023-02-24

【中文标题】文本框鼠标移出MVC中的Javascript

【英文标题】：text box mouse out Javascript in MVC

【发布时间】：2015-10-13 21:27:38

【问题描述】：

我在 MVC 中有一个文本框和按钮，通过单击按钮控制器操作被调用，并且 Jquery 中的其他代码也被调用。我想知道如何在文本框中用鼠标替换这个按钮。因此，当用户在文本框中输入内容并尝试转到下一个文本框时，所有这些操作都会发生。

这是我创建文本框和按钮的 MVC 视图代码：

Offer ID:
@html.TextBoxFor(model => model.ID, new  id = "ID" )

 <button id="btnSearch" data-url="@Url.Action("GetOffer", "LookUp")" class="btn btn-success search pull-left">Search</button>

这是通过单击按钮调用的 Jquery 函数：

<script type="text/javascript">
  $(function () 

    $("#btnSearch").click(function (evt) 
        evt.preventDefault();
        var url = $(this).data('url');

        getByOfferId(url);
    
    );
);

我不确定如何在文本框中指定此代码：

 data-url="@Url.Action("ActioName", "controllerName")"

以及调用什么操作而不是这一行：

    $("#btnSearch").click(function (evt) 

【问题讨论】：

您不想“鼠标移出”。您需要处理文本框 .change() 事件 - $('#ID').change(function() // your code ); 并且您可以删除 new id = "ID" （它将id 属性“更改”为它已经是什么）

@StephenMuecke 谢谢这一行 data-url="@Url.Action("ActioName", "controllerName")"？

您可以将其放入文本框 - @Html.TextBoxFor(m => m.ID, new data_url = "Url.Action("ActionName", "controllerName")" ) 并使用 var url = $(this).data('url'); 访问它，或者只需将其放入 .change() 函数 - var url = '@Url.Action("ActionName", "controllerName")';

@StephenMuecke 太好了，非常感谢。

【参考方案1】：

代替mouseout，处理文本框的.change() 事件。您可以使用

将网址添加到文本框

@Html.TextBoxFor(m => m.ID, new  data_url = "Url.Action("GetOffer", "LookUp")" )

请注意，文本框的id 属性默认为id="ID"（由html 助手生成），因此您不需要new id = "ID" 。那么脚本就可以了

$("#ID").change(function () 
    var url = $(this).data('url');
    getByOfferId(url);

如果脚本不在单独的文件中，您也可以只使用（不带data-url 属性）。

$("#ID").change(function () 
    var url = '@Url.Action("GetOffer", "LookUp")';
    getByOfferId(url);