Javascript 在HTML表单不起作用的情况下使用（“提交”）

有谁能给我一个线索，为什么这不起作用

我有一张表格：

<form id="add">
    .
    .
    .
    <button id="button1" type="submit">Submit</button>
</form>

---

谢谢

您正在将

input

作为上的

的第二个参数传递，因此本质上是在
上侦听
submit
事件
#add input

。输入上没有

submit

事件。删除第二个参数就可以了。

您实际上没有在提交事件的

输入上添加
readonly
属性，但
$（此）
实际上指的是整个HTML
表单
——您无法对其应用readonly属性

示例不起作用的原因：您正在对表单进行事件绑定，并在表单的一部分输入上提交表单。这意味着您的
eventDelegation
位于表单中的
输入上，并且
submit
处理程序是一个按钮
type=“submit”
-因此，这样做将始终刷新页面，并且不会提交表单也不会将道具设置为
只读
。简而言之，它根本不会做任何事情，因为
eventDelegation
不正确

要在表单提交上轻松启用所有输入，您可以使用方法
jQuery
，并查找所有
：输入
，包括任何
textarea
（如果您也有）

$(this).find(':input').prop("readonly", true); //prop all readonly

此外，您不需要在提交事件函数中添加
输入

工作演示：


$（文档）.ready（函数（）{
$（“#添加”）。关于（“提交”，函数（事件）{
event.preventDefault（）；
$（this）.find（':input'）.prop（“readonly”，true）；//prop all readonly
log（“表单已提交-所有输入现在都是只读的”）；
});
});





我是一个短信爱好者


点击我提交
#添加输入
=>这样做不会提交表单。这正是我要说的
$（'#add'）。on（'submit'，'input'，…）
与执行
$（'#add input'）相同。on（'submit'，…）
，（预期第一个会考虑以后添加到DOM的输入，但这不是重点），这就是为什么它不起作用的原因。它实际上并不相同，很明显，您是
事件绑定
表单中输入的提交。这意味着您的
eventDelegation
位于表单中的输入上-这样做将始终刷新页面，不会提交表单，也不会将道具设置为只读。简言之，它不会做任何事情。你可以试试这个例子，我知道。我只是在解释OP做了什么，为什么不起作用。我需要重复多少次？
$(this).find(':input').prop("readonly", true); //prop all readonly