나는 여러 게시물이 비슷한 주제에 이미 게시되어 있음을 알고 있지만 아직 이에 대한 좋은 답변을 찾고 있습니다. 그래서 전문가에게 나를 도와달라고 부탁합니다.DOM 콘텐츠를 즉시로드 할 때 동일한 자바 스크립트 파일을 여러 번 호출하지 않으려면 어떻게해야합니까?
JavaScript 및 JSF에서 작업중인 응용 프로그램에서 작업하고 있습니다. 페이지로드에서 여러 외부 자바 스크립트/jquery 파일 (여러 목적으로) 호출하고 그들은 잘 작동하는 것. 그러나 초기에로드되지 않거나 초기 DOM (페이지가로드 될 때)의 일부가되지 않는 일부 구성 요소 (JSF 구성 요소)가있는 페이지가 몇 개 있습니다. 그러나 페이지에서 일부 클릭 이벤트가 발생하여로드되면 (즉, 컨텐츠가 즉시로드 됨) 새 컨텐츠는 javaScript/jquery 효과를 얻지 못합니다. 내가 페이지 헤더에이
을 : 여기
은 내 질문이 더 간단하게 간단한 예입니다 ..몸에이
<div class="panel">
<p>some sample text</p>
<p class="button"><a href="javascript:fucntion">Modify</a></p>
</div>
(위 코드에서 outpu t, 나는 라운드 "수정"텍스트 버튼) 모양 얻을
누군가가 버튼 (링크), 다음 코드를 얻을 수정 클릭 수 : 그러나
<div class="panel">
<p>Do You want to modify</p>
<p class="button"><a href="javascript:fucntion">Yes</a></p>
<p class="button"><a href="javascript:fucntion">No</a></p>
</div>
을, 나는 동일하지 않습니다 "예"및 "아니오"에 대해 둥근 모양 버튼을 더 이상 사용하지 않습니다. (페이지의 맨 아래에있는 JQuery 파일을 호출해도 도움이되지 않는다.) 첫 번째 panelGroup (JSF)가로드되는 경우
<h:panelGroup render=.....>
<div class="panel">
<p>some sample text</p>
<p class="button"><a href="javascript:fucntion">Modify</a></p>
</div>
</h:panelGroup>
<h:panelGroup render=.....>
<div class="panel">
<p>Do You want to modify</p>
<p class="button"><a href="javascript:fucntion">Yes</a></p>
<p class="button"><a href="javascript:fucntion">No</a></p>
</div>
</h:panelGroup>
은 그래서 헤더에 그리고 자바 스크립트를로드하고 curveycorner와 버튼을 표시 무엇을 얻을 수 있지만, 때 : JSF를 통해
우리가 사용하는 두 번째 패널이로드되고 자바 스크립트를 가져 오지 않습니다. 그것은 작동
<h:panelGroup render=.....>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery.curvycorners.min.js"></script>
<div class="panel">
<p>Do You want to modify</p>
<p class="button"><a href="javascript:fucntion">Yes</a></p>
<p class="button"><a href="javascript:fucntion">No</a></p>
</div>
</h:panelGroup>
,하지만 우리는 같은 자바 스크립트가 여러 번 파일을 호출 피하려고하기 때문에 더 나은 옵션이 있는지 확인 : 내가 가지고있는
하나 개의 솔루션은 다음과 같다. 나는 다른 사람들로부터 어떤 의견을 가지고
추가 한 다음 후 - 사실 내가 잘못했다. Curvy corner 플러그인은 독립 실행 형이며 "curvycorners.js"를 제외한 다른 javascript/jquery 파일은 필요하지 않습니다. 만약 당신들 stlil 그것에 대해 (또는 내 자바 스크립트 지식에 대한) 의심, 그냥 다음 코드를 시도하고 'curvy 코너 "작품을 참조하십시오 (예 : http://www.curvycorners.net/ 또는 다른 곳에서"curvycorners.js "다운로드하십시오.내 코드를 시도해보십시오. 작고 간단합니다. ---------------------------------------- ----------------------------------------
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>curvyCorners - Tab demo</title>
<style type="text/css">
body { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;}
/* styles for the demo sub-pages */
#demo-btn {margin: 0.5in auto;border: 0px solid #fff;color: #fff; padding:5px 15px; text-align: center; background-color: #006354;
border: 1px solid #ccc; background-image: url(btn_middle_brnd.png); background-repeat: repeat-x; border-radius:10px; -webkit-border-radius: 10px;
-moz-border-radius: 10px; height:15px; width:80px; font-size:11px; font-weight:bold;}
#demo-btn a{color:#fff; text-decoration:none;}
</style>
<script type="text/javascript" src="../curvycorners.src.js"> </script>
</head>
<body>
<div id="demo-btn">
<span><a href="javascript:function();">Cancel</a></span>
</div>
</body>
</html>
나는 이것이 해결책이 동의하지만, 어쩌면 좀 명확하게 좀 더 설명을 추가 할 수 있습니다. 이 질문에 의해 판단하면, 묻는 사람이 대답을 이해하기에 충분한 자바의 이해력을 갖게 될 것인지를 아는 것이 어렵습니다. –
나는 다음 두 개의 자바 스크립트를 주었다. 하나는 기본 JQuery 파일이고 다른 하나는 Google 검색이나 여기에서 찾을 수있는 플러그인이다. http://www.curvycorners.net – user704805
파일만으로는 실제로 아무 것도 할 수 없습니다. –