您的位置:首页 > Web前端 > JQuery

jquery,toggle修改元素的显示和隐藏

2016-02-24 16:20 911 查看


jquery


定义和用法

toggle() 方法切换元素的可见状态。

如果被选元素可见,则隐藏这些元素,如果被选元素隐藏,则显示这些元素。 有兴趣的同学可以试一试。 这个小功能是我自己写的对于type="password"和type="text"类型之间的切换。

<!doctype html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="Generator" content="EditPlus®">

<meta name="Author" content="">

<meta name="Keywords" content="">

<meta name="Description" content="">

<script src="./jquery/jquery-1.11.3.min.js">

</script>

<script type="text/javascript">

function ToggleTest(){

$("#add_password").toggle();

$("#actual_password").toggle();

}

</script>

<title>ToggleTest</title>

</head>

<body>

<label for="add_password">Password:</label>

<input type='password' id='add_password' required placeholder="Password" value="aaaa"/>//add_password元素显示

<input style="display:none" type='text' id='actual_password' value="bbbb"/> //actual_password元素是不显示的。

<button type="button" onclick="ToggleTest()">Click me</button>

</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: