使用javascript在下拉列表中选择一个值

时间:2011-04-05 01:25:08

标签: javascript

A]问题摘要:

尝试在页面加载时预先选择用户所在国家/地区

B]详情:

1]我正在使用maximinds javascript找出一个用户县。

2]我有一个下拉列表,其中包含225个左右的国家/地区列表。

3]在我的HTMLr页面的javascript部分,我试图从下拉列表中选择用户国家/地区。

但这个国家没有被选中

C]代码摘录:

<select name="country_name" id="id_country_name">
 <option value="" selected="selected">---------</option>
 <option value="Afghanistan">Afghanistan</option>
 <option value="Aring land Islands">Aring land Islands</option>
</select>


<!-- including the  geoip javascript library -->
<script src="http://j.maxmind.com/app/geoip.js" type="text/javascript"></script>
<!-- By default, we will select users country -->       
<script type="text/javascript" language="JavaScript">
document.getElementById(geoip_country_name()).selected = true
</script>

谢谢,

[编辑#1]

尝试了以下jquery代码,但这不会填充下拉列表:

<!-- including the  geoip javascript library -->
  <script src="http://j.maxmind.com/app/geoip.js" type="text/javascript"></script>
  <script type="text/javascript" language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  <script type="text/javascript">
    $(function () {
        $("option[value='" + geoip_country_name() + "']").attr('selected', 'selected');
    });
 </script>

[编辑#2]

尝试$(“#id_country_name”)。val(geoip_country_name());,

<div id="userDataForm">
  <form method="POST" action="/UserReporting"> 
  <table>
      <!-- Printing the forms for users country, city -->
      <tr><th><label for="id_country_name">Country name:</label></th><td>
      <select name="country_name" id="id_country_name">
    <option value="" selected="selected">---------</option>
    <option value="Afghanistan">Afghanistan</option>
        <option value="Aring land Islands">Aring land Islands</option>
        <option value="Albania">Albania</option>
      </select>
      </td></tr>
      <tr><th>
      <label for="id_city_name">City name:</label></th><td><input type="text" name="city_name" id="id_city_name" /></td></tr>     
 </table>

 <input type="submit" name="report_up" value= "Report Up">
 <input type="submit" name="report_down" value= "Report Down">
 </form>

 <!-- including the  geoip javascript library -->
<script type="text/javascript" language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
</script>
<script src="http://j.maxmind.com/app/geoip.js" type="text/javascript">
</script>
<script type="text/javascript">
    $(function () {
        $("#id_country_name").val(geoip_country_name());
    });
</script>

2 个答案:

答案 0 :(得分:1)

尝试

document.getElementById('id_country_name').selectedIndex=index;

其中index是对应于所需选择的整数。

答案 1 :(得分:1)

只有当HTML中的每个document.getElementById都将国家/地区名称作为ID(用“_”或类似内容替换空格)时,<option>调用才有效:

<select name="country_name" id="id_country_name">
 <option value="" selected="selected">---------</option>
 <option id="Afghanistan" value="Afghanistan">Afghanistan</option>
 <option id="Aring_land_Islands" value="Aring land Islands">Aring land Islands</option>
</select>

但是,我倾向于使用jquery这种方法,因为它不需要为每个选项提供自己的id:

$(function () {
    $("#id_country_name").val(geoip_country_name());
});