javascript - 从 post 方法调用的文件元素在 jquery 中不可访问

Question

请帮助我。我有一个 php 文件，将通过 jQuery 的 post 方法调用。无法在 jquery 中访问此 php 文件中的 html 元素。这是我的代码片段。

查询中:

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 执行时，你正在绑定(bind)和尚不存在的元素(记住，表内的单选按钮是通过你的 ajax 动态加载的)称呼)。

因此，它不会起作用。您必须使用 .on() 才能在加载后捕获它。 (就像.live())

考虑这个例子:

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