2010-10-18 2 views
0
<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript"> 
if(window.addEventListener){ 
    window.addEventListener('load',setDay,false); 
} 
else { 
if(window.attachEvent){ 
    window.attachEvent('onload',setDay); 
    } 
} 

function setDay(){ 

document.forms[0].elements['mes'].onchange=function() { 
    n= parseFloat(this.getAttribute("label"))+1; 
    opt=[]; 
    txt=[]; 
    $("#dia > option").remove(); 
for(c=1;c<n;c++) { 

    opt[c]=document.createElement('option'); 
    txt[c]=document.createTextNode(c); 
    opt[c].value=c; 
    opt[c].setAttribute('name', 'dias'); 
    opt[c].appendChild(txt[c]); 
    document.forms[0].elements['dia'].appendChild(opt[c]); 
    } 
    } 
} 
</script> 
----- 
<select name="mes"> 
<option value="z">Mês</option> 
<option value="31" label="31">Janeiro</option> 
<option value="29" label="31">Fevereiro</option> 
<option value="31" label="31">Março</option> 
<option value="30" label="31">Abril</option> 
<option value="31" label="31">Maio</option> 
<option value="30" label="31">Junho</option> 
<option value="31" label="31">Julho</option> 
<option value="31" label="31">Agosto</option> 
<option value="30" label="31">Setembro</option> 
<option value="31" label="31">Outubro</option> 
<option value="30" label="31">Novembro</option> 
<option value="31" label="31">Dezembro</option> 
</select> 
<select name="dia" id="dia"> 
<option value="z">Dia</option> 
</select> 

<select name="ano"> 
<option>Ano</option> 
<option value="2010">2010</option> 
<option value="2009">2009</option> 
<option value="2008">2008</option> 
<option value="2007">2007</option> 
<option value="2006">2006</option> 
<option value="2005">2005</option> 
<option value="2004">2004</option> 
<option value="2003">2003</option> 
<option value="2002">2002</option> 
<option value="2001">2001</option> 
<option value="2000">2000</option> 
<option value="1999">1999</option> 
<option value="1998">1998</option> 
<option value="1997">1997</option> 
<option value="1996">1996</option> 
<option value="1995">1995</option> 
<option value="1994">1994</option> 
<option value="1993">1993</option> 
<option value="1992">1992</option> 
<option value="1991">1991</option> 
<option value="1990">1990</option> 
<option value="1989">1989</option> 
<option value="1988">1988</option> 
<option value="1987">1987</option> 
<option value="1986">1986</option> 
<option value="1985">1985</option> 
<option value="1984">1984</option> 
<option value="1983">1983</option> 
<option value="1982">1982</option> 
<option value="1981">1981</option> 
<option value="1980">1980</option> 
<option value="1979">1979</option> 
<option value="1978">1978</option> 
<option value="1977">1977</option> 
<option value="1976">1976</option> 
<option value="1975">1975</option> 
<option value="1974">1974</option> 
<option value="1973">1973</option> 
<option value="1972">1972</option> 
<option value="1971">1971</option> 
<option value="1970">1970</option> 
</select> 

Так что моя проблема в том, что я хочу, чтобы поймать значения с PHP в форме с использованием POST и у меня есть проблемы в ловле значения месяца, потому что я хотел в этом месяц имели свое значение, а не значение количества дней, которое соответствует этому месяцу. Я немного изменил этот сценарий, даже сделал лучше, но теперь я застрял.Javascript для генерации месяца и года выпадающих

Может ли кто-нибудь мне помочь? Спасибо

+0

А мои глаза! jQuery делает большую часть этого кода совершенно ненужным. Поражает читать сырое обращение с DOM –

ответ

0

Возможно, вы могли бы сохранить в атрибуте value фактические значения, которые вы собираетесь отправить на сервер, и иметь объект JavaScript/хэш в качестве таблицы поиска имен месяцев в количестве дней.

3

Изменить HTML код для этого:

<select name="mes"> 
<option value="z">Mês</option> 
<option value="1" label="31">Janeiro</option> 
<option value="2" label="31">Fevereiro</option> 
<option value="3" label="31">Março</option> 
... 
</select> 

(или названия месяцев в качестве значения, в зависимости от того, что вы хотите).

Создать таблицу поиска в JavaScript:

var numberOfDays = { 
    "1": 31, 
    "2": 29, 
    "3": 31 
    ... 
} 

, содержащий количество дней в течение каждого месяца.

Тогда вы:

var n= numberOfDays[$(this).val()]; 
opt=[]; 
txt=[]; 
$("#dia > option").remove(); 
for(c=1;c<=n;c++) { 
    //... 
} 

Side Примечание: Всегда объявлять локальные переменные var!

Btw, если вы уже используете jQuery, я бы предложил использовать его во всем скрипте. Так, например,

document.forms[0].elements['mes'].onchange=function() {...} 

станет

$('select[name=mes]').change(function() {...}); 

И есть место для других улучшений тоже;)

+0

Я должен действительно обновить страницу перед отправкой ответов ... :) –

+0

tHANKS! это было действительно полезно, спасибо за вашу помощь :) – Afonso

+0

Я постараюсь сделать это все с помощью jquery, спасибо за ваш отзыв – Afonso

0

, если вы хотите, чтобы получить название месяца, изменить HTML для

<option value="Janeiro" label="31">Janeiro</option> 

Теперь вы получите название месяца

Держите массив в PHP с месяца именем и значением

как $ montharraY со значениями $ montharraY [ «январь»] [31]

Таким образом, вы должны проверить значение, которое вы получаете от JS с этим PHP arary ,

2

Почему не нравится: http://jsfiddle.net/McDP5/

var months = [ 
    {DaysInMonth:31, Name:"Janeiro"}, 
    {DaysInMonth:31, Name:"Fevereiro"}, 
    {DaysInMonth:31, Name:"Março"}, 
    {DaysInMonth:31, Name:"Abril"}, 
    {DaysInMonth:31, Name:"Maio"}, 
    {DaysInMonth:31, Name:"Junho"}, 
    {DaysInMonth:31, Name:"Julho"}, 
    {DaysInMonth:31, Name:"Agosto"}, 
    {DaysInMonth:31, Name:"Setembro"}, 
    {DaysInMonth:31, Name:"Outubro"}, 
    {DaysInMonth:31, Name:"Novembro"}, 
    {DaysInMonth:31, Name:"Dezembro"} 
]; 
$(function() { 
    var monthSelector = $('select[name=mes]'); 
    $.each(months, function(index,month) { 
     $('<option></option>') 
      .attr('label', month.Name) 
      .attr('value', index) 
      .html(month.DaysInMonth) 
      .appendTo(monthSelector); 
    }); 
    var yearSelector = $('select[name=ano]'); 
    for(var year=1970;year<=2010;year++) 
     $('<option></option>') 
      .attr('label', year) 
      .attr('value', year) 
      .html(year) 
      .appendTo(yearSelector);    
});​ 

Или еще лучше, a calendar control from the jQuery UI

0

Это то, что я сделал для создания выпадающего меню. Требуется просто jQuery.

HTML:

<select class="form-control" id="yearMonthInput"></select> 

Javascript код:

var months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]; 

    for (i = new Date().getFullYear() ; i > 2008; i--) { 
     $.each(months, function (index, value) { 
      $('#yearMonthInput').append($('<option />').val(index + "_" + i).html(value + " " + i)); 
     });     
    } 

И выглядит таким образом:

enter image description here