無法使用Javascript

捕獲仿真模型下面是我的HTML模型，無法使用Javascript

，下面將我的JavaScript。

$(document).ready(function() { 
alert("Script is on"); 
$("#portfolioModal1").on('show.bs.modal', function() { 
    alert('The modal is about to be shown.'); 
}); 

$("#portfolioModal1").on('shown', function(){ 
    alert("Shown!"); 
}); 
}); 

$("button").click(function find_route_time() 
{ 
    // This function is tested and is working fine. 
});

我試過很多教程的解決方案，但是這不起作用。我無法理解爲什麼？模型打開時，我的javascript應該會生成警報，但沒有任何反應。

並在下面的鏈接，

<a href="#portfolioModal1" class="portfolio-link" data-toggle="modal" data-target="#portfolioModal1"> 
        <div class="portfolio-hover"> 
         <div class="portfolio-hover-content"> 
          <i class="fa fa-plus fa-3x"></i> 
         </div> 
        </div> 
      <img src="img/portfolio/EAST-CLICK.jpg" class="img-responsive" alt=""> 
       </a>

來源

2016-05-12 Quratul Ain Shafiq

什麼不工作？ – Uzbekjon

模型打開時我無法捕獲事件 –

'.on（'shown.bs.modal'，...'應該這樣做，你是否只有一個模式使用'＃portfolioModal4' id？ – Uzbekjon

這裏是你的代碼的修補程序：

Add按鈕將你的HTML代碼如下顯示：

<button type="button" class="btn btn-info btn-lg" id="myBtn">Open Modal</button>

更換你的JS代碼用以下代碼：

$(document).ready(function(){ 

$("#myBtn").click(function(){ 
    $("#portfolioModal4").modal("show"); 
}); 

    $("#portfolioModal4").on('show.bs.modal', function() { 
     alert('The modal is about to be shown.'); 
}); 

    $("#portfolioModal4").on('shown.bs.modal', function() { 
     alert('The modal is fully shown.'); 
}); 
});

注意 - 如果你想在頁面加載事件中打開彈出窗口，那麼只需從腳本中刪除點擊事件，但問題將是它只會捕獲shown事件。

讓我知道你是否覺得這有用。

此處已完成測試文件。

<!DOCTYPE html> 
<html> 
<head> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
</head> 
<body> 
    <div class="container"> 
    <a href="#portfolioModal1" data-toggle="modal" data-target="#portfolioModal1">Open Popup</a> 
    <!-- Modal --> 
    <div class="portfolio-modal modal fade" id="portfolioModal1" tabindex="-1" role="dialog" aria-hidden="true"> 
    <div class="modal-content"> 
     <div class="close-modal" data-dismiss="modal"> 
      <div class="lr"> 
       <div class="rl"> 
       </div> 
      </div> 
      .....................SOME CODE..................... 
     </div> 
    </div> 
</div> 
<script> 
    $(document).ready(function() { 
     alert("Script is on"); 
     $("#portfolioModal1").on('show.bs.modal', function() { 
      alert('The modal is about to be shown.'); 
     }); 

     $("#portfolioModal1").on('shown.bs.modal', function() { 
      alert("Shown!"); 
     }); 
    }); 
    $("button").click(function find_route_time() { 
     // This function is tested and is working fine. 
    }); 
</script> 
</body> 
</html>

來源

2016-05-12 17:51:41

我使用模型作爲鏈接，'。當鏈接被點擊時，想讓模型顯示警報 –

你的鏈接缺少data-target屬性，用你的鏈接替換你的鏈接'data-toggle =「#modal」data-target = 「＃portfolioModal1」>' –

謝謝@Yogesh科利，但這不工作... –

無法使用Javascript

回答

相關問題