admin管理员组

文章数量:1026232

I have a select dropdown containing a list of countries looking something like this:

<select name="countryCode" id="countryCode">
<option data-countryCode="GB" value="44" Selected>UK (+44)</option>
<option data-countryCode="US" value="1">USA (+1)</option>
<optgroup label="Other countries">
    <option data-countryCode="DZ" value="213">Algeria (+213)</option>
    <option data-countryCode="AD" value="376">Andorra (+376)</option>
</optgroup>
</select>

I then look up the user's country using ipinfo.io and would like to set the selected option based on the returned country and the data-countryCode attribute. I have tried some different approaches, but I simply cannot get it to work.

I have created a jsfiddle with the country-selector and the lookup: /

How do I set the drop-down to show the user's country ?

thanks

Thomas

I have a select dropdown containing a list of countries looking something like this:

<select name="countryCode" id="countryCode">
<option data-countryCode="GB" value="44" Selected>UK (+44)</option>
<option data-countryCode="US" value="1">USA (+1)</option>
<optgroup label="Other countries">
    <option data-countryCode="DZ" value="213">Algeria (+213)</option>
    <option data-countryCode="AD" value="376">Andorra (+376)</option>
</optgroup>
</select>

I then look up the user's country using ipinfo.io and would like to set the selected option based on the returned country and the data-countryCode attribute. I have tried some different approaches, but I simply cannot get it to work.

I have created a jsfiddle with the country-selector and the lookup: http://jsfiddle/E7fBk/

How do I set the drop-down to show the user's country ?

thanks

Thomas

  • javascript
  • jquery
  • html
Share Improve this question asked Nov 4, 2013 at 16:37 ThomasDThomasD 2,4947 gold badges40 silver badges59 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 6

Try

$(function () {
    $.get("http://ipinfo.io", function (response) {
        $('#countryCode option[data-countryCode="' + response.country + '"]').prop('selected', true)
    }, "jsonp");
});

Demo: Fiddle

Fiddle DEMO

$(function () {
    $.get("http://ipinfo.io", function (response) {
        $('#countryCode option[data-countryCode="' + response.country + '"]').prop('selected', true)
    }, "jsonp");
});

or

Fiddle DEMO

$(function () {
    $.get("http://ipinfo.io", function (response) {
        $('#countryCode').val($('#countryCode [data-countryCode="' + response.country + '"]').val());
    }, "jsonp");
});

I have a select dropdown containing a list of countries looking something like this:

<select name="countryCode" id="countryCode">
<option data-countryCode="GB" value="44" Selected>UK (+44)</option>
<option data-countryCode="US" value="1">USA (+1)</option>
<optgroup label="Other countries">
    <option data-countryCode="DZ" value="213">Algeria (+213)</option>
    <option data-countryCode="AD" value="376">Andorra (+376)</option>
</optgroup>
</select>

I then look up the user's country using ipinfo.io and would like to set the selected option based on the returned country and the data-countryCode attribute. I have tried some different approaches, but I simply cannot get it to work.

I have created a jsfiddle with the country-selector and the lookup: /

How do I set the drop-down to show the user's country ?

thanks

Thomas

I have a select dropdown containing a list of countries looking something like this:

<select name="countryCode" id="countryCode">
<option data-countryCode="GB" value="44" Selected>UK (+44)</option>
<option data-countryCode="US" value="1">USA (+1)</option>
<optgroup label="Other countries">
    <option data-countryCode="DZ" value="213">Algeria (+213)</option>
    <option data-countryCode="AD" value="376">Andorra (+376)</option>
</optgroup>
</select>

I then look up the user's country using ipinfo.io and would like to set the selected option based on the returned country and the data-countryCode attribute. I have tried some different approaches, but I simply cannot get it to work.

I have created a jsfiddle with the country-selector and the lookup: http://jsfiddle/E7fBk/

How do I set the drop-down to show the user's country ?

thanks

Thomas

  • javascript
  • jquery
  • html
Share Improve this question asked Nov 4, 2013 at 16:37 ThomasDThomasD 2,4947 gold badges40 silver badges59 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 6

Try

$(function () {
    $.get("http://ipinfo.io", function (response) {
        $('#countryCode option[data-countryCode="' + response.country + '"]').prop('selected', true)
    }, "jsonp");
});

Demo: Fiddle

Fiddle DEMO

$(function () {
    $.get("http://ipinfo.io", function (response) {
        $('#countryCode option[data-countryCode="' + response.country + '"]').prop('selected', true)
    }, "jsonp");
});

or

Fiddle DEMO

$(function () {
    $.get("http://ipinfo.io", function (response) {
        $('#countryCode').val($('#countryCode [data-countryCode="' + response.country + '"]').val());
    }, "jsonp");
});

本文标签： javascriptSetting option in select dropdown based on dataattributeStack Overflow

版权声明：本文标题：javascript - Setting option in select dropdown based on data-attribute - Stack Overflow 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745627717a2159965.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。