1

スペクトルカラーピッカーhttp://bgrins.github.io/spectrum/を使用しています。問題は、htmlファイルから新しい要素を追加することです

field_constructor.html

    <div id="constructor">
    <div class="label_constructor">
    <div class="label_text"><label>label:</label><input type="text"/></div> 
    <div class="label_backcolor"><label> backcolor :</label><input type="text" maxlength="6" size="6" class="colorpicker" value="000000" /></div>
    <div class="label_textcolor" ><label>textcolor:</label><input type="text" maxlength="6" size="6" class="colorpicker" value="000000" /></div>

jqueryコード

      $($champdiv).load("field_constructor.html #constructor");
      $("#form_content").prepend($champdiv);

jqueryコードは、次のようなイベントを手動で起動するまで実行されません 

        $("body").on("mouseover",function(){

        $(".colorpicker").spectrum({
       color: "#f00"
       }); 
       });

または手動トリガーイベント手動トリガーイベントなどの多くのソリューションを試しましたが、機能する唯一のイベントは、そのように作成された同じクラスのフィールドでのボディマウスオーバーまたはオンクリックです

 $input=$('<input type="text" maxlength="6" size="6" class="colorpicker"  value="000000" />');

これはブラウザにとって非常に重いので、良い解決策が見つからないので助けてください

4

1 に答える 1

2

jQuery ロード関数のドキュメントを参照してください: http://api.jquery.com/load/。ロードが完了すると起動するコールバックを渡すことができ、そこからカラーピッカー (および結果コンテナー内のもののみ) を初期化できるはずです。

$('#result').load("field_constructor.html #constructor", function() {
   $("#result .colorpicker").spectrum({
       color: "#f00"
   }); 
});
于 2013-04-30T12:17:59.653 に答える