如何将数据从可点击的div填充到文本框中

Question

我正在尝试将数据从可点击的div容器填充到文本框中。以下所有代码都存在于同一个文件"schedule.php"中。

jQuery函数是：

$(document).ready(function(){
 $("#listItem1").click(function(){
  var selectedAddress = $("#listItem1").attr("value");
  $.post("schedule.php",selectedAddress,function(selectedAddress){
    addressSelect($("#listItem1").attr("value"));
  });
 });
});

php代码存在于同一个文件中：

<?php 
  function addressSelect($selectedAddress) {
$selectedAddress=$_POST['$selectedAddress'];    
//echo $selectedAddress;
    if(isset($selectedAddress)) list($fromName, $fromAddress, $fromCity,     $fromState, $fCountry, $fromZip, $fromPhone) = explode("$$$", $selectedAddress);
  }
?>

我无法填充它。我还尝试使用$.ajax。。。但无济于事。。我应该怎么做才能填充文本框。

HTML是这样的：

<table CELLSPACING=0 CELLPADDING=1 border=0 width=200>
    <tr><td colspan=4 height=10></td></tr>
    <tr>
      <td width=7></td>
      <td WIDTH=180 height=35><b>Name</b><font size="-1" color="#FF0000">*</font></td>
      <td colspan=2 WIDTH=220>
        <input NAME="fromName" TYPE="text" id="fromName" placeholder="Sender's Name" style="width:150px;" value="<?php echo $fromName;?>" MAXLENGTH="35" autofocus onBlur="ValidateName(fromName)">
        <span class="error">  <?php echo $fromNameErr;?></span>
      </td>
    </tr>    
    <tr>
      <td></td>
      <td height=35><b>Address</b><font size="-1" color="#FF0000">*</font></td>
      <td>
      <TEXTAREA NAME="fromAddress" COLS=30 ROWS=3 id="fromAddress" placeholder="Sender's Address" style="width:200px; height:130px; font-size:13px; font-family:Arial,sans-serif" onBlur="ValidateAddress(fromAddress)"></TEXTAREA>
      <span class="error">  <?php echo $fromAddressErr;?></span>
      </td>      
      <td rowspan=3 align="center"></td>     
    </tr>
    <tr>
      <td></td>
      <td height=35><b>Landmark</td>
      <td>
      <input NAME="fromLandmark" TYPE="text" id="fromLandmark" placeholder="optional" style="width:150px" value="<?php echo $fromLandmark;?>" MAXLENGTH=45>
      </td>
    </tr>
    <tr>
      <td></td>
      <td height=35><b>City</b><font size="-1" color="#FF0000">*</font></td>
      <td>
      <input NAME="fromCity" TYPE="text" id="fromCity" placeholder="Source City" style="width:150px" value="<?php echo $fromCity;?>" MAXLENGTH=35>
      </td>
    </tr>
    <tr>
      <td></td>
      <td height=35><b>State</b><font size="-1" color="#FF0000">*</font></td>
      <td colspan=2>
      <input NAME="fromState" TYPE="text" id="fromState" placeholder="State of Source City" style="width:150px" value="<?php echo $fromState;?>" MAXLENGTH=25>
      </td>
    </tr>
    <tr>
      <td></td>
      <td height=35><b>Zip</b><font size="-1" color="#FF0000">*</font></td>
      <td colspan=2>
      <input NAME="fromZip" TYPE="text" id="fromZip" placeholder="Pin Code" style="width:90px" value="<?php echo $fromZip;?>" MAXLENGTH=15 onBlur="ValidateZip(fromZip)">
      <span class="error">  <?php echo $fromZipErr;?></span>
      </td>
    </tr>
    <tr>
      <td></td>
      <td height=35><b>Country</b></td>
      <td colspan=2>
      <select NAME="fromCountry" id="fromCountry" disabled="disabled">
      <?php populate_country();?>
      </select></div></td>
      </td>
    </tr>  
    <tr>
      <td></td>
      <td height=35><b>Phone</b><font size="-1" color="#FF0000">*</font></td>
      <td colspan=2>
      <input NAME="fromPhone" TYPE="text" id="fromPhone" placeholder="Sender's Phone no." style="width:150px" value="<?php echo $fromPhone;?>" MAXLENGTH=15 onBlur="ValidatePhone(fromPhone)">
      <span class="error">  <?php echo $fromPhoneErr;?></span>
      </td>
    </tr>
    <tr><td colspan=4 height=10></td></tr>
  </table>
        <?php /*?><td style="border-right:1px solid #b2b2b2; font-size:1px; background-color: #fafafa">&nbsp;</td><?php */?>
    </tr>
    <tr>
        <td width=6 height=6></td>
        <?php /*?><td height=6 style="border-bottom:1px solid #b2b2b2; font-size:1px; background-color: #fafafa">&nbsp;</td><?php */?>
        <td width=6 height=6></td>
    </tr>
  </table><!-- End of From Address container table-->

Answer 1

@user2298875提供的代码有一个小错误。更改

    content = $("#" + divId).innerHTML;
    $("#" + textBoxId).value = content; 

至

$("#" + textBoxId).val($("#" + divId).html());

Answer 2

我认为您希望将数据复制到浏览器上，而不是服务器上。您可以使用以下JQuery代码来完成它：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script language="javascript" type="text/javascript"> 
    function copyData(divId, textBoxId) { 
        content = $("#" + divId).html();
        $("#" + textBoxId).val(content); 
    }
</script> 
<body>
    <div id="my-div" onclick="copyData('my-div', 'my-text-box');">
        This the data to be copied.
    </div>
    <input type="text" id="my-text-box" name="myTextBox"/>
</body>