在不刷新的情況下選擇特定選項時提示消息

Question

我希望在使用ajax選項的值爲square時警告這是一個正方形。但我的問題是，當我進入頁面並選擇方形選項時，什麼都沒有發生，需要刷新以提醒這是方形的。

這是我的腳本，檢查是否設置了平方值，以便ajax可以處理它。

$(document).ready(function() { 
if($('#SelectBox').val() == 'square'){ 
    $.ajax({ 
     type:'post', 
     url:'views/index/test', 
     data:{}, 
     success:(function (response) { 
      alert(response) 
     }) 
    }) 
} 
}) 

，這是我的test.php

<?php echo "this is square"?> 

，這些都是我的標籤

<select name="selected_option" id="SelectBox"> 
<option value="default" selected="selected">Select one option </option> 
<option value="square">Square</option> 
<option value="rectangle">Rectangle</option> 
</select> 

Answer 1

你在頁面加載運行支票一次。相反，掛鉤事件處理程序的change事件select的：

$(document).ready(function() { 
    $('#SelectBox').on("change", function() {   //**** 
     if ($('#SelectBox').val() == 'square') {  // Can use `$(this).val()` instead here 
      $.ajax({ 
       type: 'post', 
       url: 'views/index/test', 
       data: {}, 
       success: (function(response) { 
        alert(response) 
       }); 
      }); 
     } 
    }); 
});