Question

我正在尝试在按钮上启动touchevent时创建一个下拉列表。

这个没有带来选择选项。有什么解决方案吗？

function mouseDown(){
var game=[game1,game2];
var html='<select>';
for(i=0;i<game.length;i++)
{
html+='<option>'+game[i]+'</option>';
}
html+='</select>';
$("#button").append(html);
}

Answer 1

如果game1和game2不变，那就是问题所在。

var game=["game1","game2"];  //MISSED the ""

试试这个

var game = ["game1", "game2"];
var html = $("<select/>");
for (var val in game) {
    $("<option />", {
        value: val,
        text: game[val]
    }).appendTo(html);
}
html.appendTo($('button'));

Answer 2

最后，我设法得到了解决方案。

我将图片作为背景添加到下拉列表中，设置了 data-role为无，删除边框等。请参阅中的css 小提琴
为避免下拉列表中的预选文本，我得到了解决方案从堆栈溢出的讨论之一，但忘了得到网址，所以无法在这里打印 - 道歉。解决方案是设置 selectedIndex为-1。请参阅小提琴中的功能。打电话给来自body标签的功能。想法是在每次加载时重置页面所以选定的值将不再存在。
为了避免在背景图片上显示文字，我添加了一个 text-intent为-9999px，因此文本不会显示在图像上。我有这个解决方案再次来自本网站的不同讨论。

FIDDLE

玩得开心，享受你的一天......快乐的学习......

按钮上的ontouchstart打开下拉列表

2 个答案: