Question

如果用户点击下拉列表中的某个选项，你可以帮助我在jquery中显示日历吗？这是我的代码

function OnChange(dropdown)
{
  var status = dropdown [dropdown.selectedIndex].text;
  status = dropdown[dropdown.selectedIndex].value;
  if (status == 01){
      $(function() {
         ("#datepicker").datepicker({ minDate: 0, maxDate: "+5M" });
        alert ("Success");
        });
  }
  return true;
}

我的Html

<tr>
         <td>
         <select id="schedule" onchange="OnChange(this.form.schedule);" >
     //I used jquery here to get the value of select option from database and works ok
     //There is corresponsing value on the options. If 01, the calendar will be shown, the rest..it will not be shown


      </select>
    </td>
</tr>

如果选择01，我想在下拉列表旁边显示日历。 jquery中的问题是，在日历显示之前它需要id，如#datepicker。我不需要额外的文本框或任何东西，并在选择日期之后..它将显示在选择字段下方。感谢

Answer 1

你的意思是：http://jsfiddle.net/Hbpv7/2/

当前选择值01时，我当前正在添加临时日期选择器（内联）。如果您选择了日期，则会删除日期选择器并显示新日期。

$(function(){
    $.ajax({
        url : "yoururl.php",
        success : function(result){
            $("select").append(result);
        }
    });
    $("select").change(function(){
        if($(this).find("option:selected").text() == "01")
        {
            showDatepicker.call(this);
        }   
        else
        {
             $("#tmpdatepicker").remove();   
        }
    });
});

function showDatepicker()
{
    // Don't  show more then 1
    if($("#tmpdatepicker").length) return;

    $(this).after("<div id='tmpdatepicker'></div>");
    var _tmp = $("#tmpdatepicker").datepicker({
        onSelect : function(dateText, inst){
             $(this).after("<div class='mydate'>" + dateText + "</div>").remove();
        }   
    });
}

Answer 2

//try this
$("#datepicker").datepicker({ minDate: 0, maxDate: "+5M" }).hide();
$("#schedule").bind("change",function(){
  if ($(this).val() == 01)
     $("#datepicker").show();
  else
     $("#datepicker").hide();
});

当用户从select选项中选择值来自数据库时，在Jquery datepicker中显示日历

2 个答案: