javascript onclick 事件在带有 SQL 驱动数据的 Chrome 中不起作用

Question

<select id='city' name='city' > 
<?php
$dbcon = mysql_connect($host, $username, $password);
mysql_select_db($db_name,$dbcon) or die( "Unable to select database");
$city_query = "SELECT city,county FROM citycatalog order by city asc";
$city_res = mysql_query($city_query);
$city_num = mysql_num_rows($city_res);
$i=0;
while($i < $city_num){
$city_val = mysql_result($city_res,$i,'city');
$county_val = mysql_result($city_res,$i,'county');
echo "<option value=\"$city_val\" onClick=\"document.getElementById('county').value = '$county_val'\" >$city_val</option>";
$i++;
};
?>
</select>
<input type="text" id='county' name='county' />

这段代码在 IE 和 FF 中运行得很好，但在 Chrome 和 Safari 中则不行。 我不知道如何解决这个问题。 我尝试过在 select 标签上使用 onChange 事件作为替代方案，但是变量位于 select 标签之后，并且 SQL 不会将任何数据带入事件。 请推荐一位堆叠设计师。 谢谢!

Answer 1

option 不支持

onclick。您应该使用select 的onchange。该值可以存储在诸如 data-county 之类的属性中(data- 属性可用于存储元素上的数据):

<select id='city' name='city' onchange="document.getElementById('county').value = this.options[this.selectedIndex].getAttribute('data-county');"> 
<?php
$dbcon = mysql_connect($host, $username, $password);
mysql_select_db($db_name,$dbcon) or die( "Unable to select database");
$city_query = "SELECT city,county FROM citycatalog order by city asc";
$city_res = mysql_query($city_query);
$city_num = mysql_num_rows($city_res);
$i=0;
while($i < $city_num){
$city_val = mysql_result($city_res,$i,'city');
$county_val = mysql_result($city_res,$i,'county');
echo "<option value=\"$city_val\" data-county=\"$county_val\" >$city_val</option>";
$i++;
};
?>
</select>
<input type="text" id='county' name='county' />