如何使用semantic-ui模態

我有semantic-ui模態的問題，當我點擊命令時我會顯示模態但模態運行不正常。在我點擊命令模態後，模態顯示出來，然後自己關閉。如何使用semantic-ui模態

視圖代碼

 <div class = "ui form grid_6 omega"> 
     <form target="paypal" method="post"> 
      <div class="field1"> 
      <div class="field"> 
       <label>Nama</label> 
       <input placeholder="Nama" name="nama" type="text"> 
      </div> 
      <div class="field"> 
       <label>No. HP</label> 
       <input placeholder="No. HP" name="handphone" type="text"> 
      </div> 
      <div class="field"> 
       <label>Alamat</label> 
       <input placeholder="alamat" name="alamat" type="text"> 
      </div> 
      <div class="field"> 
       <label>Jumlah</label> 
       <div class="selectbox"> 
        <select name="jumlah" id=""> 
        <?php for ($i=1; $i <= 20; $i++): ?> 
        <option value="<?php echo $i; ?>"><?php echo $i; ?></option> 
        <?php endfor; ?> 
       </select> 
       </div> 

      </div> 
      <button type="submit" name="submit" class="ui teal button order-button">Order now</button> 
      </div> 
     </form> 
     </div> 

     <div id="modaldiv" class="ui small modal"> 
       <i class="close icon"></i> 
       <div class="header"> 
        Smalls Like Bakin 
       </div> 
       <div class="content"> 
        <p>Thank you for your order</p> 
       </div> 
       <div class="actions"> 
        <div class="ui positive right labeled icon button"> 
        <a class="text-white" href="<?php echo site_url('home/order');?>">Back to Home</a> 
        <i class="checkmark icon"></i> 
        </div> 
       </div> 
       </div>

腳本模式

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script type="text/javascript" src="<?php echo base_url(); ?>packaged/javascript/semantic.js"></script> 
<script type="text/javascript"> 
    $('.order-button').click(function(){ 
     $('#modaldiv').modal('show'); 
    }); 

</script>

你可以幫我解決這個問題？謝謝。

來源

2013-12-11 user3040066

檢查調試控制檯中的錯誤消息。否則，最好的辦法是提供一個小提琴，這樣我們可以更有效地幫助你。 – TCHdvlp

你是什麼意思關閉自我？ – iMom0

和你一樣...... – Dickeylth

它會工作：

$('#btn').click(function(){ 
    //do something 
    this.preventDefault(); 
});

來源

2014-07-22 11:11:52 Baya

我做了一個在semantic.js代碼（訴1.8.1）「黑客」，在5831線，在模式設置被設定。取而代之的

close : '.close, .actions .button',

我只是把：

close : '.close',

這是因爲我想在整個應用程序相同的行爲。該行的含義是「哪些選擇器會關閉模式？」。

來源

2015-02-12 16:30:37

確保爲'transition'和'dimmer'組件添加相應的JS和CSS文件，因爲它們用於語義模式以及'模態'組件本身。

來源

2015-06-10 16:27:36 DruidKuma

我以前有同樣的問題，但點擊打開<a>元素的模態後，解決方案完全刪除了屬性href。在這種情況下，可能與按鈕上的submit事件有關。

來源

2017-05-29 03:24:18

如何使用semantic-ui模態

回答

相關問題