JQuery 컬러 박스 쇼는 어떻게 만듭니 까?

나는이 플러그인을 사용하고 있습니다 :이 단계에 붙어JQuery 컬러 박스 쇼는 어떻게 만듭니 까?

https://github.com/evoluteur/colorpicker

Now, let's attach it to an existing <input> tag: 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#mycolor").colorpicker(); 
    }); 
</script> 

<input style="width:100px;" id="mycolor" />

내가 머리에 스크립트를 걸었습니다 분명히 입력이 몸에있다. 나는 파일 경로가 옳다는 것을 보증했고 아무런 오류도 없다. mycolor 필드에 들어가면 색상 상자가 표시되지 않습니다. 나는 JS에 익숙하지 않고 조금 당혹 스럽다. 작동 방법을 모릅니다. 내가 잘못하고있는 것에 대한 아이디어가 있습니까? 해당 사이트의 지시를 읽는 유지하는 경우

출처

2013-08-27 starbucks

'' 태그 바로 앞에있는 문서 끝 부분에 스크립트를 두어 스크립트가로드되기 전에 모든 DOM 요소가 렌더링되었는지 확인하십시오. – kunalbhat

@kunalbhat 당신이 제안한대로했는데 작동하지 않았습니다. 감사. – starbucks

HTML을 게시 할 수 있습니까? 그렇지 않으면 말하기 어렵다. – kunalbhat

, 당신이이를 배치해야한다고 다음 <input> 후

<div style="width:128px;"> 
    <input style="width:100px;" id="mycolor" class="colorPicker evo-cp0" /> 
    <div class="evo-colorind" style="background-color:#8db3e2"></div> 
</div>

기본적으로, 절대 최소값은 이것이다 :

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript" charset="utf-8"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script> 
    <script src="js/evol.colorpicker.min.js" type="text/javascript" charset="utf-8"></script> 
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/ui-lightness/jquery-ui.css"> 
    <link href="css/evol.colorpicker.css" rel="stylesheet" type="text/css"> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#mycolor").colorpicker(); 
     }); 
    </script> 
    <div style="width:128px;"> 
     <input style="width:100px;" id="mycolor" class="colorPicker evo-cp0" /> 
     <div class="evo-colorind" style="background-color:#8db3e2"></div> 
    </div>

출처

2013-08-27 15:32:08 DevlshOne

고마워. 전에 시도했지만 작동하지 않았다. 단순히 입력 상자와 밝은 파란색으로 된 div를 제공하지만 위젯은 표시되지 않습니다. – starbucks

감사합니다. 하나 이상의 상자에이 기능을 사용하려면 어떻게해야합니까? – starbucks

필요한 모든 파일을 로컬'js'와'css' 폴더에 저장 했습니까? – DevlshOne

사실 아니, 절대 최소값은 이것이다 :

<link id="jquiCSS" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/ui-lightness/jquery-ui.css" type="text/css" media="all"> 
<link href="css/evol.colorpicker.css" rel="stylesheet" /> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js" type="text/javascript"></script> 
<script src="js/evol.colorpicker.js" type="text/javascript"></script> 

<input id="mycolor" value="#000000" /> 

<script> 
    $(document).ready(function(){ 
     $('#mycolor').colorpicker() 
    }); 
</script>

색상 선택기는 당신을위한에서 추가 div 태그를 넣습니다. @DevlshOne이 참조하는 지시 사항 섹션은 수동으로 태그를 추가하여 색상 선택기를 시작하는 또 다른 방법을 보여 주지만 필요하지는 않습니다. 지시 사항이 가장 명확하지 않습니다.

JQuery, JQuery-UI, 모든 JQuery-UI 테마 (계속 표시되지만 투명하게 표시됨), evol.colorpicker.js (또는 evol.colorpicker) 만 있으면됩니다. min.js), evol.colorpicker.css 및 색상 선택 도구를 시작하기 전에로드됩니다.

출처

2013-09-10 08:10:03 MattOG

JQuery 컬러 박스 쇼는 어떻게 만듭니 까?

답변

관련 문제