Question

我有这样的html和js（带jquery）代码：

<label>Nationality</label>
<select name="user_nationality" class="input">
    <option value="1" selected onclick="$('#userphonearea').val('+62');">Indonesia</option>
    <optgroup label="Other Countries">
      <option value="2" onclick="$('#userphonearea').val('+44');">United Kingdom</option>
      <option value="3" onclick="$('#userphonearea').val('+1');">United States of America</option>
    </optgroup>
</select>

<label>Phone Number</label>
<input type="text" name="user_phone_area" id="userphonearea" maxlength="5" size="5" value="" placeholder="+" required />
<input type="text" name="user_phone_number" maxlength="30" size="10" required />

如果选择 user_nationality ，我想自动输入 user_phone_area 。我使用onclick，它适用于桌面浏览器。但它不适用于Android或iPhone等移动浏览器。

我尝试使用OnSelect更改OnClick，但它在桌面和移动设备上都不起作用

<select name="user_nationality" class="input">
    <option value="1" selected onselect="$('#userphonearea').val('+62');">Indonesia</option>
    <optgroup label="Other Countries">
      <option value="2" onselect="$('#userphonearea').val('+44');">United Kingdom</option>
      <option value="3" onselect="$('#userphonearea').val('+1');">United States of America</option>
    </optgroup>
</select>

Answer 1

找到了我自己的问题的答案

<select name="user_nationality" id="changecountry" class="input">
<option value="1" phonecode="+62">Indonesia</option>
<optgroup label="Other Countries">
    <option value="2" phonecode="+44">United Kingdom</option>
    <option value="3" phonecode="+1">United States of America</option>
</optgroup>

<script>
$('#changecountry').on('change', function() {
    var phonecode = $('option:selected', this).attr('phonecode');
    $('#userphonearea').val(phonecode);
});
</script>

JavaScript OnClick选择标记在移动浏览器上不起作用

1 个答案: