jQuery按钮事件处理程序没有't更改内容

jQuery button event handler doesn't change content

本文关键字:事件处理 按钮 程序 jQuery      更新时间:2024-05-19

为什么这个点击事件不能更改#输出中的文本?但如果我在表单标记外写按钮标记,它会更改#输出中的文本。

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
<form>
    <button id="compressStart">Start</button>
</form>
<p id="output"></p>
<script src="js/jquery-2.2.3.js"></script>
<script src="js/test.js"></script>
</body>
</html>

JS-

"use strict";
$(function () {
    $("#compressStart").click(getDecompressInput);
});
function getDecompressInput() {
    $("#output").text('Hello');
}

由于在form中使用<button></button>元素,因此其默认行为是提交表单。

如果您希望按钮不sumbit表单,则将属性type设置为button

<button type="button" id="compressStart">Start</button>