Fatal编程技术网
  • javascript/
  • Javascript 选中“检查”时，必须在div标记中显示表单。div必须临时禁用

Javascript 选中“检查”时，必须在div标记中显示表单。div必须临时禁用

javascript html

Javascript 选中“检查”时，必须在div标记中显示表单。div必须临时禁用,javascript,html,Javascript,Html,这是我下面给出的代码。我必须让表单对用户更有吸引力。我有很多表格，但我在下面只列出了一个。当复选框被选中时。它必须显示div标记。它必须是临时禁用的。它必须显示在下面的复选框中。我不熟悉html和javascript。但是我在w3.org的帮助下创建了一些东西。但现在我感到无助。专家们，请帮我一个办法 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1

这是我下面给出的代码。我必须让表单对用户更有吸引力。我有很多表格，但我在下面只列出了一个。当复选框被选中时。它必须显示div标记。它必须是临时禁用的。它必须显示在下面的复选框中。我不熟悉html和javascript。但是我在w3.org的帮助下创建了一些东西。但现在我感到无助。专家们，请帮我一个办法

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    <link rel="stylesheet" type="text/css" href="form.css"></style>
    </head>
    <body>
    <h2><u>Plans</u></h2>
    <div id="space"><br></div>
    <h3><u>1)Expenses</u></h3>
    <div id="space"><br></div>
    <div id="form">
    <form action="">
    <div id="Location"><input type="checkbox" name="placename" />Location
    <div id="editloc">
    <table>
    <tr><td>City:</td>
    <td><input type="text" value="Please enter City name.." size="50"/></td></tr>
    <tr><td>State:</td>
    <td><input type="text" value="Please enter State name.." size="50" /></td></tr>
    <tr><td>Country:</td>
    <td><input type="text" value="Please enter Country name.." size="50" /></td></tr>
    <tr><td><input type="button" value="save" /></td><td><input type="button" value="reset" /></td></tr>
    </table></div>
    </div>
    </form>
    </div>
    </body>
    </html>


无标题文件
计划


1） 费用


位置
城市：
声明：
国家：
试试这个：

html:

Jquery：

$(document).on("change", "#Location", function () {
    var obj = $(this);
    if (obj.is(":checked")) $("#form").show();
    else $("#form").hide();
});
这是纯javascript方法。不需要任何javascript库，请尝试此操作

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="form.css"></style>
<script type="text/javascript">
function ShowEditLoc(obj)
{
    document.getElementById("editloc").style.display = obj.checked ? "block" : "none";
}
</script>
</head>
<body>
<h2><u>Plans</u></h2>
<div id="space"><br></div>
<h3><u>1)Expenses</u></h3>
<div id="space"><br></div>
<div id="form">
<form action="">
<div id="Location"><input type="checkbox" name="placename" onclick="ShowEditLoc(this)" />Location
<div id="editloc" style="display:none">
<table>
<tr><td>City:</td>
<td><input type="text" value="Please enter City name.." size="50"/></td></tr>
<tr><td>State:</td>
<td><input type="text" value="Please enter State name.." size="50" /></td></tr>
<tr><td>Country:</td>
<td><input type="text" value="Please enter Country name.." size="50" /></td></tr>
<tr><td><input type="button" value="save" /></td><td><input type="button" value="reset" /></td></tr>
</table>
</div>
</div>
</form>
</div>
</body>
</html>


无标题文件
功能ShowEditLoc（obj）
{
document.getElementById（“editloc”）.style.display=obj.checked？“块”：“无”；
}
计划


1） 费用


位置
城市：
声明：
国家：

$(document).on("change", "#Location", function () {
    var obj = $(this);
    if (obj.is(":checked")) $("#form").show();
    else $("#form").hide();
});

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="form.css"></style>
<script type="text/javascript">
function ShowEditLoc(obj)
{
    document.getElementById("editloc").style.display = obj.checked ? "block" : "none";
}
</script>
</head>
<body>
<h2><u>Plans</u></h2>
<div id="space"><br></div>
<h3><u>1)Expenses</u></h3>
<div id="space"><br></div>
<div id="form">
<form action="">
<div id="Location"><input type="checkbox" name="placename" onclick="ShowEditLoc(this)" />Location
<div id="editloc" style="display:none">
<table>
<tr><td>City:</td>
<td><input type="text" value="Please enter City name.." size="50"/></td></tr>
<tr><td>State:</td>
<td><input type="text" value="Please enter State name.." size="50" /></td></tr>
<tr><td>Country:</td>
<td><input type="text" value="Please enter Country name.." size="50" /></td></tr>
<tr><td><input type="button" value="save" /></td><td><input type="button" value="reset" /></td></tr>
</table>
</div>
</div>
</form>
</div>
</body>
</html>