通過點擊將值傳遞給單行文本框

Question

我有一個表單。

<form name="form1" method="post" action=""> 
    Please enter address: 
    <input type="text" name="address" id="address" value="Some Address" style="width:350px"> 
    <input type="submit" name="GO" id="GO" value="GO!"> 
</form> 

1: address 1 

2: address 2 

3: address 3 

4: address 4 

默認情況下，單行文本框的值爲「某地址」。

但還有其他地址如下形式如上。如：

1：地址1

2：地址2

3：地址3

4：地址4

ETCS ...

我想點擊地址1並用一個新的值「地址1」替換「某個地址」，等等與其他地址。

這些地址是從一個MySQL數據庫使用PHP生成的。

我該如何繼續？

Answer 1

如果您選擇使用jQuery，您可以使用click事件，然後獲取該值並更改文本框的值。考慮下面這個例子：Sample Fiddle

<?php 

$result = array(); 
// sample select pseudo code since you didn't provided the db fetching 
// $con = new msqli('host', 'username', 'password', 'database'); 
// $query = mysqli_query($con, 'SELECT address_name FROM table_blah_blah_blah_address'); 
// while($row = $query->fetch_assoc()) { 
// $result[] = $row; 
// } 
// lets save it contains addresses fetched from db (SAMPLE!) 
$result = array(
    array('name' => 'address 1'), 
    array('name' => 'address 2'), 
    array('name' => 'address 3'), 
    array('name' => 'address 4'), 
); 

?> 

<form name="form1" method="post" action=""> 
    Please enter address: 
    <input type="text" name="address" id="address" value="Some Address" style="width:350px" /> 
    <input type="reset" value="Revert" /> 
    <input type="submit" name="GO" id="GO" value="GO!"> 
</form> 

<div class="addresses"> 
<?php foreach($result as $line_num => $address): ?> 
    <a href="#" class="clickable_address" data-value="<?php echo $address['name']; ?>" style="cursor: pointer;"><?php echo ++$line_num.'. '. $address['name']; ?><br/></a> 
<?php endforeach; ?> 
</div> 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    $('.clickable_address').on('click', function(){ 
     $('#address').val($(this).data('value')); 
    }); 
}); 
</script> 

Answer 2

您可以從您的數據庫調用轉換爲鏈接的項目，並使用與onclick屬性的JavaScript;

//A mock of your php code - the actual db call is not shown in your question 
<?php while($row = db::getline()): ?> 
    <a href="#" onclick="yourfunc('<?php echo $row['col'];?>');return false;"><?php echo $row['col'];?></a> 
<?php endwhile; ?> 

<script type="text/javascript"> 
yourfunc(val){ 
    document.getElementById("address").value = val; 
} 
</script>