Question

我得到了一个微不足道的问题，但我似乎无法优雅地解决这个问题。我有一个HTML表单，我想用javascript显示日期（今天和接下来的2天，dd / mm）。该页面建立在jQueryMobile上。

这是我的HTML

<form>
<select name="departure" id="departure">
        <option ><script>document.write(today);</script></option>
        <option ><script>document.write(tomorrow);</script></option>
        <option ><script>document.write(dayaftertomorrow);</script></option>
</select>
</form>

这是我的Javascript

var today = new Date();
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0!
if(dd<10) {
    dd='0'+dd
} 
if(mm<10) {
    mm='0'+mm
} 
today = dd+'/'+mm;

//---------- 
var tomorrow = new Date(new Date().getTime() + 86400000);
var day = tomorrow.getDate()
var month = tomorrow.getMonth() + 1
if(day<10) {
    day='0'+day
} 
if(month<10) {
    month='0'+month
} 
tomorrow = day+'/'+month

//---------- 
var aftertomorrow = new Date(new Date().getTime() + 172800000);
var afterday = aftertomorrow.getDate()
var aftermonth = aftertomorrow.getMonth() + 1
if(afterday<10) {
    afterday='0'+afterday
} 
if(aftermonth<10) {
    aftermonth='0'+aftermonth
} 
aftertomorrow = afterday+'/'+aftermonth

此处the JSFiddle

你会怎么做？

由于格雷格

Answer 1

看看这个：http://jsfiddle.net/S8HZV/1/

我在选项中添加了一个id，并在脚本中添加了3行。尝试使用innerHTML而不是document.write。

HTML：

<form>
<select name="departure" id="departure">
    <option id="today"></option>
    <option id="tomorrow"></option>
    <option id="dayaftertomorrow"></option>
</select>
</form>

JavaScript的：

document.getElementById('today').innerHTML= today;
document.getElementById('tomorrow').innerHTML= tomorrow;
document.getElementById('dayaftertomorrow').innerHTML= aftertomorrow;

Answer 2

您可以创建选项元素并使用javascript将它们插入到select中。

例如，您可以将今天添加为离场选择

的选项

 var select = document.getElementById('departure');
 var option = document.createElement('option');
 option.innerHTML = today;
 select.appendChild(option);

Answer 3

对于另一个选项，它也会设置值。

http://jsfiddle.net/isherwood/S8HZV/5/

document.getElementById('departure').options[0].val = today;
document.getElementById('departure').options[0].text = today;

document.getElementById('departure').options[1].val = tomorrow;
document.getElementById('departure').options[1].text = tomorrow;

document.getElementById('departure').options[2].val = aftertomorrow;
document.getElementById('departure').options[2].text = aftertomorrow;

如何在下拉字段中显示javascript值？

3 个答案: