php - 从使用 Ajax 创建的输入中获取值

Question

我已经使用 Jquery $.get 动态创建了一个表单，现在我想使用另一个 $.get 提交该表单，但我的表单字段的值显示为未定义。我一直在阅读如何使用 .on() 句柄执行此操作，但我似乎无法让它与我的代码一起使用。

我的第一个脚本:

function getMark(uslID){
    $('#usOut').html('<p style="text-align:center;"><img src="<?php echo site_url().'images/ajax-loader-fb.gif'; ?>" /></p>');
    $.get("../../class/class.clients.php", {pk: uslID, get: "2"})
    .done(function(data) {
        $("#usOut").html(data);
    });
}

生成的 HTML:

<div id="usOut">
  <div style="text-align:center;">
    <h3>Mark US</h3>
    <div id="usl1-contents" class="uslContents styled_form">
      <table width="100%" cellpadding="0" cellspacing="2" border="0" class="uslContentsTable tableMid">
        <tbody>
          <tr>
            <td width="20%"><label for="usl1-certNum">Cert#:</label></td>
            <td><input type="text" id="usl1-certNum" name="usl1-certNum" class="validate[required,minSize[4]]" placeholder="12345" style="width:285px;" required="" /><span class="form_hint">Enter the Certificate Number</span></td>
          </tr>
          <tr>
            <td><label for="usl1-issued">Issued:</label></td>
            <td><input type="text" id="usl1-issued" name="usl1-issued" class="datePicker hasDatepicker" required="" /><img class="ui-datepicker-trigger" src="/portal/images/icons/cal-clock-icon-16x16.png" alt="..." title="..." /><span class="form_hint">Enter the Date the Certificate/Endorsement was Issued</span><input type="hidden" id="altusl1-issued" name="altusl1-issued" class="datePickerAlt" required="" /></td>
          </tr>
          <tr>
            <td><label for="usl1-expiry">Expires:</label></td>
            <td><input type="text" id="usl1-expiry" name="usl1-expiry" class="datePicker hasDatepicker" /><img class="ui-datepicker-trigger" src="/portal/images/icons/cal-clock-icon-16x16.png" alt="..." title="..." /><span class="form_hint">Enter the Date the Certificate/Endorsement Expires</span><input type="hidden" id="altusl1-expiry" name="altusl1-expiry" class="datePickerAlt" /></td>
          </tr>
          <tr>
            <td colspan="2"><input name="doComplete" type="button" id="doComplete" value="Save" class="form-button" onclick="markUS('1')" /></td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</div>

我的第二个脚本:

function markUS(uslID){
    $('#usOut').html('<p style="text-align:center;"><img src="<?php echo site_url().'images/ajax-loader-fb.gif'; ?>" /></p>');
    var $certNum = $("#usl"+uslID+"-certNum").val();
    var $issuedDate = $("#altusl"+uslID+"-issued").val();
    var $expiryDate = $("#altusl"+uslID+"-expiry").val();
    if($certNum!=undefined && $issuedDate!=undefined || $certNum!="" && $issuedDate!="") {
        $.get("../class/class.clients.php", {pk: uslID, multivalues: $certNum+','+$issuedDate+','+$expiryDate, get: "3"})
        .done(function(data) {                  
            $('#usOut').html('<tr><td colspan="6" style="text-align:center;">'+data+'<br/><img src="<?php echo site_url().'images/ajax-loader-fb.gif'; ?>" /></td></tr>');
            $.get("../../class/class.clients.php", {client: "<?php echo $client_id; ?>", get: "4"})
            .done(function(data) {
                $("#usOut").html(data);
            });
        });
    }
};

表单开始提交，但 $certNum、$issuedDate 和 $expiryDate 全部显示为 undefined。其他一切都还好。谁能向我解释一下如何让它发挥作用以及为什么该过程有效？谢谢。 :)

Answer 1

先销毁这些元素(使用 $('#usOut').html)，然后才能从中获取值，检索值然后显示加载图像。

function markUS(uslID){
    var $certNum = $("#usl"+uslID+"-certNum").val();
    var $issuedDate = $("#altusl"+uslID+"-issued").val();
    var $expiryDate = $("#altusl"+uslID+"-expiry").val();
    $('#usOut').html('<p style="text-align:center;"><img src="<?php echo site_url().'images/ajax-loader-fb.gif'; ?>" /></p>');
    if($certNum!=undefined && $issuedDate!=undefined || $certNum!="" && $issuedDate!="") {
        $.get("../class/class.clients.php", {pk: uslID, multivalues: $certNum+','+$issuedDate+','+$expiryDate, get: "3"})
        .done(function(data) {                  
            $('#usOut').html('<tr><td colspan="6" style="text-align:center;">'+data+'<br/><img src="<?php echo site_url().'images/ajax-loader-fb.gif'; ?>" /></td></tr>');
            $.get("../../class/class.clients.php", {client: "<?php echo $client_id; ?>", get: "4"})
            .done(function(data) {
                $("#usOut").html(data);
            });
        });
    }
}