2015-07-01 85 views
0

如何通過點擊圖像來顯示我的jQuery模態?看看這個:點擊顯示模態jquery

其實我試圖在模態框中顯示JQplot圖表。隨着點擊圖像,在框應顯示

在同一頁..

<div id="dialog" title="Basic dialog"> 
<div id="chart1" style= "width:40%;height:200px"> </div> 
</div> 
<img id="imgg" src = "stats_matching/gprier.gif" alt = "perso"> 


    <script> 
    $(document).ready(function(){ 
    $.jqplot.config.enablePlugins = true; 
    var s1 = [2, 6, 7, 10]; 
    var ticks = ['a', 'b', 'c', 'd']; 

    plot1 = $.jqplot('chart1', [s1], { 
     // Only animate if we're not using excanvas (not in IE 7 or IE 8).. 
     animate: !$.jqplot.use_excanvas, 
     seriesDefaults:{ 
      renderer:$.jqplot.BarRenderer, 
      pointLabels: { show: true } 
     }, 
     axes: { 
      xaxis: { 
       renderer: $.jqplot.CategoryAxisRenderer, 
       ticks: ticks 
      } 
     }, 
     highlighter: { show: false } 
    }); 

});  

     $("#dialog").hide(); 
     $('#imgg').click(
      function() { 
       $(this).data('clicked',true); 
      } 
     ); 

     if($('#imgg').data('clicked')) { 
       console.log('refefez'); 
       $("#dialog").show().dialog(); 

     } 


    </script> 
+0

創建一個jsfiddle,http://jsfiddle.net – dreamweiver

+0

您可以先將所有js代碼放入文檔ready functon中。 – viarnes

回答

0

你需要有聽 數據屬性的變化的功能。

` $(document).on('data-attribute-changed', function() { 
     if($('#imgg').data('clicked')) {    
      $("#dialog").show().dialog(); 

     }   
    });` 

謝謝, Charles。