js实现复制功能

html

<div class="ywjl_why">
		<span>
			<input type="text" value="http://www.1238.com " readonly></input>
			<em class="copy">复制链接</em>
		</span>
	</div>

css

.ywjl_why{

	position: absolute;
	right: -90px;
	top: 60px;
	width:347px;
	height:105px;
	background:#FFFDEE;
	border:1px solid #EED38C;
	z-index: 1;
}
.ywjl_why:after{
	content: '';
	position: absolute;
	top: -5px;
	left: 170px;
	width: 10px;
	height: 10px;
	background:#FFFDEE;
	border-left: 1px solid #EED38C;
	border-top: 1px solid #EED38C;
	transform: rotate(45deg);
}
.ywjl_why span{
	width: 308px;
	height: 32px;
	margin: 0 auto;
	display: block;
	margin-top: 16px;
	
}
.ywjl_why span input{
	width: 210px;
	height: 30px;
	float: left;
	line-height: 32px;
	border: 1px solid #ddd;
	border-radius:4px 0 0 4px;
	padding-left: 10px;
}
.ywjl_why span em{
	float: left;
	width:86px;
	height:32px;
	background:#E94729;
	color: #fff;
	line-height: 32px;
	text-align: center;
	cursor: pointer;
	border-radius:0px 4px 4px 0px;
}

js

<script>
	$(function(){
		$('.copy').click(function(){
				 	$('.ywjl_why input').trigger('select');
				  	document.execCommand('copy');
				 	alert('复制成功')
				  })
			})
	})
</script>

效果图