從post方法中調用的文件元素在jquery中不可訪問

Question

請幫幫我。我有一個將通過jQuery的post方法調用的php文件。這個php文件中的html元素無法在jquery中訪問。 這是我的代碼片段。

查詢：

var getFinishOptions = $.post("ajax_finish_options.php", 
{ event_id: event_name}, 
    function(data) 
    { 
    $("#TimeToFinish").append(data); 
    } 
); 

HTML：

<div id="TimeToFinish"> </div> 

PHP：

<tr style="width: 100%"> 
    <th style="width: 100%" colspan="2"><?php echo $FinishCategory[0]; ?> </th> 
    <th style="width: 100%" colspan="3"><?php echo $FinishCategory[1]; ?> </th> 
    <th style="width: 100%" colspan="3"><?php echo $FinishCategory[2]; ?> </th> 
</tr> 

<tr> 
    <td> Option 1 </td> 
    <td> Option 2 </td> 
    <td> Option 1 </td> 
    <td> Option 2 </td> 
    <td> Option 3 </td> 
    <td> Option 1 </td> 
    <td> Option 2 </td> 
    <td> Option 3 </td> 
</tr> 

<tr> 

    <td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[0]][$event_id][0]; ?>" />&nbsp;<?php echo $FinishOption[$FinishCategory[0]][$event_id][0]; ?> </td> 
    <td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[0]][$event_id][1]; ?>" />&nbsp;<?php echo $FinishOption[$FinishCategory[0]][$event_id][1]; ?> </td> 
    <td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[1]][$event_id][0]; ?>" />&nbsp;<?php echo $FinishOption[$FinishCategory[1]][$event_id][0]; ?> </td> 
    <td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[1]][$event_id][1]; ?>" />&nbsp;<?php echo $FinishOption[$FinishCategory[1]][$event_id][1]; ?> </td> 
    <td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[1]][$event_id][2]; ?>" />&nbsp;<?php echo $FinishOption[$FinishCategory[1]][$event_id][2]; ?> </td> 
    <td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[2]][$event_id][0]; ?>" />&nbsp;<?php echo $FinishOption[$FinishCategory[2]][$event_id][0]; ?> </td> 
    <td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[2]][$event_id][1]; ?>" />&nbsp;<?php echo $FinishOption[$FinishCategory[2]][$event_id][1]; ?> </td> 
    <td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[2]][$event_id][2]; ?>" />&nbsp;<?php echo $FinishOption[$FinishCategory[2]][$event_id][2]; ?> </td> 
</tr> 

最後一塊的jQuery：

$("input[type=radio][name=FinishOptions]").click(function() {  
     alert($(this).val()); 
    }); 

所有我想要的是，獲得的任何一個檢查單選按鈕的值。

請給出您的寶貴意見。

Answer 1

你無法獲得值的原因是，在你最後一塊jQuery執行時，你是綁定和尚不存在的元素（記住，表中的單選按鈕是動態加載的，通過你的ajax呼叫）。

因此，它不會工作。您必須使用.on()才能在加載後進行捕獲。 （它像.live()）

考慮這個例子：

// change the final piece of jquery 
$('#TimeToFinish').on('click', 'input[type="radio"][name="FinishOptions"]', function() { 
    var value = $(this).val(); 
    alert(value); 
});