jQuery的点击方法没有连接到按钮 [英] jquery click method is not attached to button
问题描述
我有asp.net mvc的5应用程序，但我不能让这个相当简单的脚本工作。我是新来这个MVC（我的WebForms的家伙）。
jQuery的基本上没有（）事件附加。点击该按钮将数据发布到底层控制器。
有人可以找出什么我做错了？
视图（的HelloWorld / Index.cshtml）：
@model HelloWorld.Models.HelloWorldModel＆LT;！DOCTYPE HTML＆GT;
＆LT; HTML和GT;
＆LT; HEAD＆GT;
＆LT;标题＆GT;的Hello World＆LT; /标题＆GT;
＆LT;脚本SRC =〜/脚本/ jQuery的-2.1.3.min.js＆GT;＆LT; / SCRIPT＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
＆LT; DIV＆GT;
@using（Html.BeginForm（欢迎光临，HelloWorld的，FormMethod.Post，新{ID =myhelloform}））{ ＆LT;跨度＆GT;名称：LT; / SPAN＆GT;
@ Html.TextBoxFor（型号=＆GT; model.Name）
＆LT;按钮ID =btnPost类型=按钮＆GT;邮政和LT; /按钮＆GT;
}
＆LT; / DIV＆GT; ＆LT;脚本＆GT;
VAR TESTFORM =功能（）{
VAR的init =功能（）{
$（＃btnPost）。在（点击，函数（）{
警报（任何人那里？）;
提交表格（）;
}）;
}; VAR submitForm =功能（）{
$ .hit（{
网址：@ Url.Action（欢迎光临，HelloWorld的），
数据：$（＃myhelloform）serializeArray（）。
成功：函数（响应）{
警报（response.Message）;
}
}）;
}; 返回{
初始化：初始化
};
}; ＆LT; / SCRIPT＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
＆LT; / HTML＆GT;
控制器（控制器/ HelloWorldController.cs）：
使用System.Web.Mvc;
命名空间HelloWorld.Controllers
{
公共类HelloWorldController：控制器
{
公众的ActionResult指数（）
{
返回查看（）;
} [HttpPost]
公共JsonResult欢迎（）
{
返回JSON（测试）;
}
}
}
示范（型号/ HelloWorldModel.cs）
命名空间HelloWorld.Models
{
公共类HelloWorldModel
{
公共字符串名称{;组; }
}
}
删除变量TESTFORM和init和它的作品（还需要使用$（文件）。就绪为@Tbseven提到）：
$（文件）。就绪（函数（）{
$（＃btnPost）。在（点击，函数（）
{
警报（任何人那里？）; }）;
}）;
小提琴： https://dotnetfiddle.net/HCdFXM
I have asp.net mvc 5 application but I can't get this fairly simple script to work. I am new to this MVC (I am WebForms guy). Basically jQuery is not attaching .click() event to the button to post data to the underlying controller.
Can somebody pinpoint what I am doing wrong?
The View (HelloWorld/Index.cshtml):
@model HelloWorld.Models.HelloWorldModel
<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
<script src="~/Scripts/jquery-2.1.3.min.js"></script>
</head>
<body>
<div>
@using (Html.BeginForm("Welcome","HelloWorld",FormMethod.Post, new {id = "myhelloform"})){
<span>Name:</span>
@Html.TextBoxFor(model=> model.Name)
<button id="btnPost" type="button">Post</button>
}
</div>
<script>
var testform = function () {
var init = function () {
$("#btnPost").on("click", function () {
alert("anybody there??");
submitForm();
});
};
var submitForm = function () {
$.hit({
url: "@Url.Action("Welcome", "HelloWorld")",
data: $("#myhelloform").serializeArray(),
success: function (response) {
alert(response.Message);
}
});
};
return {
Init: init
};
};
</script>
</body>
</html>
</html>
The Controller (Controllers/HelloWorldController.cs):
using System.Web.Mvc;
namespace HelloWorld.Controllers
{
public class HelloWorldController : Controller
{
public ActionResult Index()
{
return View();
}
[HttpPost]
public JsonResult Welcome()
{
return Json("test");
}
}
}
The Model (Models/HelloWorldModel.cs)
namespace HelloWorld.Models
{
public class HelloWorldModel
{
public string Name { get; set; }
}
}
Delete the variables testform and init and it works (Also need to use $( document ).ready as @Tbseven mentions):
$( document ).ready(function() {
$("#btnPost").on("click", function ()
{
alert("anybody there??");
});
});
Fiddle: https://dotnetfiddle.net/HCdFXM
这篇关于jQuery的点击方法没有连接到按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
