<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<style>
input{
transition: 1s;
width: 200px;
}
.bewider{
width: 500px;
}
</style>
</head>
<body>
<input type="text" name="">
<button>按下我的效果跟input被focus的效果一樣</button>
<script type="text/javascript">
$(function(){
$('input').focus(function(){
$(this).addClass('bewider');
}).blur(function(){
$(this).removeClass('bewider');
});
$('button').click(function(){
$('input').trigger('focus');
});
});
</script>
</body>
</html>
全站熱搜
留言列表
伺服器架設 (1)
