Question

我的网页上有几个小时的下拉列表。后端将值作为int返回。例如：“TimeHours”：12。

以下代码未将值预设为12.但是，如果我将BE值从12更改为“12”，则可以正常工作。

我应该如何让它发挥作用？我尝试更改<option value="1">1 </option> to <option value=1>1 </option>，但这也不起作用。

<li class="align" >                
 <select id="TimeHours" name="TimeHours" 
       style="width:60px" data-value="{{this.TimeHours}}">                    
       <option value="1">1 </option>
       <option value="2">2 </option>
       <option value="3">3 </option>
       <option value="4">4 </option>
       <option value="5">5 </option>
       <option value="6">6 </option>
       <option value="7">7 </option>
       <option value="8">8 </option>
       <option value="9">9 </option>
       <option value="10">10 </option>
       <option value="11">11 </option>
       <option value="12">12 </option>                       
  </select></li>

Answer 1

$(function(){
  var select = $("#TimeHours");
  select.val(select.attr("data-value"));
});

使用.attr()返回一个字符串，而不是.data()将值转换为类型。

Answer 2

使用jquery .val函数..

$('#TimeHours').val(function () {
    return $(this).data('value')['TimeHours'];
});

假设data-value='{"TimeHours": "12"}'

DEMO： http://jsfiddle.net/ts594/

Answer 3

以这种方式标记您要选择的那个：

   <option value="2">2 </option>
   <option value="3">3 </option>
   <option value="4">4 </option>
   <option value="5">5 </option>                    
  ...
   <option selected value="12">12 </option>

Answer 4

你尝试过吗？

data-value="{{praseInt(this.TimeHours)}}

Answer 5

除了将selected添加到正确的<option>标记之外，无法预先选择一个选项。

这就是我有这个代码的原因：

(function() {
    // enable default attribute on <select>
    var sels = document.querySelectorAll("select[data-value]"), l = sels.length, i,
        opts, m, j;
    for( i=l-1; i>=0; i--) {
        opts = sels[i].getElementsByTagName('option'); m = opts.length;
        for( j=0; j<m; j++) {
            if( opts[j].value == sels[i].getAttribute("data-value")) {
                sels[i].selectedIndex = j;
                break;
            }
        }
        sels[i].removeAttribute("data-value");
    }
})();

预先选择下拉值

5 个答案: