url 복사하기 버튼을 만들었습니다. 그런데 복사가 안되네요.

안녕하세요.

url 복사하기 버튼을 추가했습니다. 그런데 복사가 안되네요. 

다른 분이 이전에 질문에 대한 답변을 응용하여 작업을 했습니다.

이 내용을 보고 작업했습니다. -> https://www.cosmosfarm.com/threads/document/33505

<div class="copy_url">
					<div class="copy_msg">Quảng cáo sản phẩm của bạn <span class="dashicons dashicons-controls-play"></span></div>
					<button type="button" class="button" id="copy-url">Sao chép URL sản phẩm</button>
					<input id="my-url" type="hidden" value="<?php echo esc_url($_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'])?>">
				</div>
				<script>
				jQuery(document).ready(function(){
					 jQuery('#copy-url').click(function(){
					  	var url = document.getElementById('my-url');
					  
					  	url.select();
					  	document.execCommand('Copy');
					  	alert('Url đã được sao chép.');
					 });
				})
				</script>

 

해당 페이지 php에 코딩을 그대로 적용하여 넣어봤지만... 작동이 안되네요.

이곳은 url 복사 버튼 만들어놓은 페이지 입니다.

https://www.koalaa.kr/shop/?mod=document&uid=160&pageid=1#top 

 

무엇이 잘못된건지 초보라 잘 모르겠네요.

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
워드프레스 에러 기술지원 서비스 전문가에게 맡기세요
  • 안녕하세요~^^

    올려주신 링크의 코드는 input 태그의 type이 text일 때 정상적으로 동작합니다.

    hidden에서도 동작하게 하시려면

    올려주신 코드 대신 아래의 코드로 교체해서 확인해보시겠어요?

    <div class="copy_url">
    <div class="copy_msg">Quảng cáo sản phẩm của bạn <span class="dashicons dashicons-controls-play"></span></div>
    	<button type="button" class="button" id="copy-url">Sao chép URL sản phẩm</button>
    	<input id="my-url" type="hidden" value="<?php echo esc_url($_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'])?>">
    </div>
    
    <script>
    jQuery(document).ready(function(){
    	jQuery('#copy-url').click(function(){
    		var url = document.getElementById('my-url');
    		
    		url.type = 'text';
    		url.select();
    		
    		document.execCommand('Copy');
    		
    		url.type = 'hidden';
    		
    		alert('Url đã được sao chép.');
    	});
    })
    </script>

    고맙습니다.

  • 알려주신 코드를 복사해서 붙혀넣기 했는데 여전히 작동이 안되네요 ㅠㅠ

    뭐가 문제일까요? 혹시 다른 문제로 인해 작동이 안되는 경우가 있을까요?

    수정 전
    
    <div class="copy_url">
    					<div class="copy_msg">Quảng cáo sản phẩm của bạn <span class="dashicons dashicons-controls-play"></span></div>
    					<button type="button" class="button" id="copy-url">Sao chép URL sản phẩm</button>
    					<input id="my-url" type="hidden" value="<?php echo esc_url($_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'])?>">
    				</div>
    				<script>
    				jQuery(document).ready(function(){
    					 jQuery('#copy-url').click(function(){
    					  	var url = document.getElementById('my-url');
    					  
    					  	url.select();
    					  	document.execCommand('Copy');
    					  	alert('Url đã được sao chép.');
    					 });
    				})
    				</script>
    
    
    
    
    
    -------------------------------------------------------------------------------------------------
    수정 후
    <div class="copy_url">
    <div class="copy_msg">Quảng cáo sản phẩm của bạn <span class="dashicons dashicons-controls-play"></span></div>
    	<button type="button" class="button" id="copy-url">Sao chép URL sản phẩm</button>
    	<input id="my-url" type="hidden" value="<?php echo esc_url($_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'])?>">
    </div>
    
    <script>
    jQuery(document).ready(function(){
    	jQuery('#copy-url').click(function(){
    		var url = document.getElementById('my-url');
    		
    		url.type = 'text';
    		url.select();
    		
    		document.execCommand('Copy');
    		
    		url.type = 'hidden';
    		
    		alert('Url đã được sao chép.');
    	});
    })
    </script>

     

  • 이전 댓글에 안내해드린 코드는

    저희 쪽 테스트 서버에서는 정상적으로 동작하고 있습니다.

    만약 해당 코드가 정상적으로 동작하지 않는다면

    구글에 "jquery url copy" 키워드로 검색하셔서 다른 코드들도 참고해보시겠어요?

    고맙습니다.

  • 아 답이 없네요.... 찾아서 적용해봐도 계속 오류만 나고....초보라 어디가 틀린지 모르겠고... 푸념만 적고 가네요 ㅠㅠ

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기