我已经安装了一个下拉菜单(在 php 站点中),它利用 Ajax 功能来填充下拉列表。
它可以在 Chrome 和 Firefox 中正常运行,但不能在 Safari 中运行。
在 Safari 中它可以工作;
- 如果用户按 Tab 键进入该字段;
- 如果用户双击该字段,或者单击该字段,然后单击该元素外部。
表单代码读取;
$(document).ready(function(){
$('.sel_field').focus(function(){
$.ajax({
url: 'GetClient.php',
type: 'post',
dataType: 'json',
success:function(response){
var len = response.length;
$('#sel_user').empty();
for( var i = 0; i<len; i++){
var id = response[i]['id'];
var name2 = response[i]['username'];
var name = response[i]['name'];
var mat = response[i]['Matter'];
$('#sel_user').append('<option value='+id+'> ClientID: '+id+' - Name: '+name+' : '+mat+'</option>');
}
}
});
});
});
<tr>
<td>
Client ID <span style='font-size:10px'>(Press tab to enter)</span>
</td>
<td>
<select name='clientID' style='width:460px' class='form-control sel_field' id='sel_user' >
<option value='0'> - Make A Selection -</option>
</select>
</td>
</tr>
最佳答案
首先,您可以尝试在用于附加行中的值的 id 周围加上一些引号。
$('#sel_user').append('<option value="'+id+'"> ClientID: '+id+' - Name: '+name+' : '+mat+'</option>');
不引用该值可能会使 Safari 浏览器感到困惑。
我还会将页面底部的表格的回显更改为此。我发现使用单引号来回显 html 输出更加直观,并且允许您对标记属性使用双引号。
echo
'<tr>
<td>
Client ID <span style="font-size:10px">(Press tab to enter)</span>
</td>
<td>
<select name="clientID" style="width:460px" class="form-control sel_field" id="sel_user" >
<option value="0"> - Make A Selection -</option>
</select>
</td>
</tr>';
关于javascript - Safari 问题 - 使用 AJAX 的下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50442045/