jquery - 将选择菜单的宽度与jquery中的文本输入字段匹配

Question

我正在使用 jquery-mobile 从用户那里获取信息。我似乎无法将选择菜单的宽度与文本输入字段的宽度对齐。

在我的小提琴中，选择菜单应该与两个文本输入字段相同。我能够匹配我的选择菜单的背景和边框颜色，使其看起来就像文本输入字段一样。但是当我调整选择菜单的宽度时，它与不同的手机和方向不一致。

注意：我不知道为什么，但是我的 css 上的“.wide .ui-select .ui-btn”确实调整了选择菜单的颜色和边框，但它并没有在小提琴上做。不过，我不知道如何匹配不同浏览器的宽度。

提前致谢。

score 0 · Accepted Answer

这可能有效：

$(document).ready(function(){
    $.each($('select'), function () {
        $(this).selectmenu({ width : $(this).attr("width")})
    })
})

score 0 · Accepted Answer

select {
    background: black;
    border: 2px solid white;
    color: #fff;
    padding: 2px;
    width: 123px;
}

score 0 · Accepted Answer

如果没有应用 jQuery Mobile CSS 就很难说，但我最好的猜测是box-sizing可能会有所不同，或者一些填充量正在改变它。如果您在某个地方有我们可以戳的实时版本，请分享。

score 0 · Accepted Answer

您在标记为 class="wide" 的 dom 元素中的输入和选择使用它们的默认宽度。使用类似这样的东西来更好地控制它们的宽度：

.wide input, .wide select {
    width: 100%;
}

编辑width: 100%以width: 123px调味。

4 回答 4