码迷，mamicode.com
首页 > 其他好文 > 详细

SearchFlight_Joker

时间：2016-06-02 00:39:39      阅读：240      评论：0      收藏：0      [点我收藏+]

标签：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>DragonFlight</title>
        <link href="css/SearchFlight.css" rel="stylesheet"type="text/css">
        <script type="text/javascript" src="js/jquery-1.11.3.js"></script>    
        <script type="text/javascript" src="js/SearchFlight.js"></script>    
<style type="text/css">
       .*{
    margin:0;
    padding:0;
}

/* banner begin*/
.banner{
    width:100%;
    height:80px;
    line-height: 65px;
    text-align: left;
    margin-left:65px;
    padding-left: 160px;
    font-family: arial bold;
    font-size: 40px;
    background: url(http://www.websbook.com/upimg/litimg/080214/03203011303.jpg) no-repeat left center;
}/* banner end*/

/* main-navigation begin */
.main-navigation {
    width: 100%;
    height:50px;
    text-align: center;
    display: inline-block;
    background: #3b3c3b;
}
.main-navigation ul {
    display: block;
    list-style-type: none;
    width:80%;
    height:44px;
    margin:3px auto;
}
.main-navigation ul li {
    float: left;
    display: inline-block;
    height:44px;
    padding: 0px 10px;
}
.main-navigation ul li a {
    float: left;
    display: inline-block;
    height:45%;
    line-height: 70%;
    padding: 13px 5px;
    font: bold 12px/12px Arial, Helvetica, sans-serif;
    color: #FFF;
    font-size: 15px;
    text-decoration: none;
    text-transform: uppercase;
}
.main-navigation ul li a:hover {
    background-color: #fff;
    color: #000;
    border-radius:2px;
}/* main-navigation end */

/* base_top begin */
.base_top{
    background: url(http://image.so.com/v?ie=utf-8&src=hao_360so&q=travel&fromurl=http%3A%2F%2Fmy.pclady.com.cn%2Fp%2F1238671.html#ie=utf-8&src=hao_360so&q=travel&fromurl=http%3A%2F%2Fmy.pclady.com.cn%2Fp%2F1238671.html&lightboxindex=5&id=8dcafcdf5f48fd304bce18a6751a231d&multiple=0&itemindex=0&dataindex=30) no-repeat center center;
}
#search_box {
    width: 50%; 
    margin: 5px auto;
    z-index: 10;
    border-radius: 6px;
    color: #000;
    font-size: 14px;
    font-family: Tahoma, Arial, ‘Hiragino Sans GB‘, "Microsoft Yahei", \5b8b\4f53, sans-serif;
    padding: 5px;
    background-color: #3498db;
}
.search-title .flight-tit {
    width: 228px;
}
.search-title h3 {
    margin-top: 4px;
    line-height: 45px;
    text-align: center;
    color: #fff;
    font-size: 25px;
    font-family: "Microsoft Yahei",arial,sans-serif;
    font-weight: 300;
    border: solid #3498db;
    border-width: 1px 1px 0;
    border-radius: 6px;
}
.form_group {
    margin: 0 0 15px;
    position: relative;
    line-height: 30px;
}
.search_filter,.search_filter form {
    display: block;
    margin-top: 0em;
}
.search_form {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    padding:10px 28px;
    border-radius: 5px;
    background-color: #fff;
    color: #333;
    font-size: 14px;
}
.search_form .form_group .form_fields label input{
    width:50px;
    display:inline-block;
    margin:0;
    padding:0;
}
.form_title{
    float:left;
    padding-right:5px;
}
/* .search_form .ico_info {
    display: inline-block;
    vertical-align: middle;
    vertical-align: middle;
    _vertical-align: -4px;
    width: 12px;
    height: 12px;
    background-position: -210px -114px;
} */
.form_fields {
    margin-left: 70px;
}
.input_radio{
    margin-left: 23px;
    padding-right: 10px;
}
.input_txt {
    width: 322px;
}

.input_txt {
    padding: 4px 0 4px 3px;
    outline: medium none;
    border-width: 1px;
    border-style: solid;
    border-color: #BBB #DDD #DDD #BBB;
    box-shadow: 1px 1px 1px #DDD inset;
    font-size: 14px;
    font-family: Tahoma, Arial, ‘Hiragino Sans GB‘, "Microsoft Yahei", \5b8b\4f53, sans-serif;
    height: 20px;
    line-height: 20px;
}
.watermark, .inputSel {
    color: #999 !important;
}
.clearfix, .clearfix .form_group { 
    display: inline-block;
}
.search-traveler-types .form_title {
    width: 61px;
    top: 5px;
}
.multi_search_content .multiTitle{
    width:40px;
}

.search-traveler-types .form_group .form_fields {
    margin-left: 3px;
    height:35px;
}
.search_form select {
    padding: 2px;
    _padding: 0;
    height:25px;
    width: 105px;
    border: 1px solid #D7D7D7;
    font-family: Arial, ‘Hiragino Sans GB‘, "microsoft yahei",sans-serif;
}
option {
    font-weight: normal;
    display: block;
    padding: 0px 2px 1px;
    min-height: 1.2em;
}
.flight_direct{
    float:left;
}
.Nonstop{
    display: inline-block;
    width:150px;
    height:18px;
    line-height: 18px;
    text-align: center;
    margin-left:45px;

}

.multi_form_group{
    margin: 15px 10px;
    position: relative;
    line-height: 30px;
    width:100%;
    overflow: hidden;
}
.multi_label{
    display: inline-block;
    height:40px;
    line-height: 40px;
    margin: 0 auto;
    text-align: center;
}
.multi_form_group .multi_form_content{
    width:130px;
    padding: 4px 0 4px 3px;
    outline: medium none;
    border: 1px solid;
    border-color: #BBB #DDD #DDD #BBB;
    box-shadow: 1px 1px 1px #DDD inset;
    font-size: 14px;
    font-family: Tahoma, Arial, ‘Hiragino Sans GB‘, "Microsoft Yahei", \5b8b\4f53, sans-serif;
    height: 20px;
    line-height: 20px;
}
.form_group .add_trip{
    display:block;
    width:98%;
    border:1px dashed #111;
    text-decoration: none;
    text-align: center;
}
#multform_last a:hover{
    border:2px dashed #3498db;
}

.search_flight{
    display: line-block;
    width:150px;
    height:40px;
    line-height: 40px;
    text-align: center;
    background-color:#3498db;
    border-radius: 5px;
    font-family: arial;
    float:right;
}
.search_flight a{
    color:#fff;
    text-decoration: none;
    font-size:20px;
}
/* base_top end */

/* SelectCity board style begin*/
#menu1 a:link{
     color:#2c3e50;
     text-decoration:none;
     font-family: Roboto light,regular,medium bold;
}

#menu1 a:visited {
     color: #00F;
     text-decoration:none;
}

#menu1 a:hover {
     color: #c00;
     font-family: Roboto light,regular,medium bold;
}

#select ul{
    list-style:none;
}

.main{
     clear:both;
     padding:8px;
     text-align:center;
}

#select{
     text-align:left;
     width:550px;
     background-color: #ecf0f1;
}

.areas{
     position:relative;
     overflow:hidden;
     height:22px;
     width:545px;
     text-align:left;
}

#menu1{
     position:absolute;
     top:0;
     left:0;
     z-index:1;
}

#menu1 li{
     float:left;
     display:block;
     cursor:pointer;
     width:72px;
     text-align:center;
     line-height:21px;
     height:21px;
}

#menu1 li.hover{
     background:#ecf0f1;
     border-left:1px solid #acb5c9;
     border-top:1px solid #acb5c9;
     border-right:1px solid #acb5c9;
     border-radius: 1px;
}

.cities{
     clear:both;
     margin-top:-1px;
     border:1px solid #acb5c9;
     height:150px;
     width:543px;
}

#main1 ul{
    display: none;
}
#main1 ul.block{
    display: block;
}
.city{
    width:60px;
    height:20px;
    line-height: 20px;
    margin:2px 2px;
    float:left;
    font-family: arial;
    font-size: 15px;
}
/* SelectCity board style end*/


</style>           
    </head>
    <body>
        <div class="banner">DragonFlight</div>
        <div class="nav_wrapper">    
            <div class="main-navigation">
                <ul>
                    <li><a href="#">Home</a></li>
                    <li><a href="#">Flights</a></li>
                    <li><a href="#">Vacations</a></li>
                    <li><a href="#">Hotels</a></li>
                    <li><a href="#">Cars</a></li>
                    <li><a href="#">Insurance</a></li>
                    <li><a href="#">Destinations</a></li>
                    <li><a href="#">Blog</a></li>
                    <li><a href="#">Help</a></li>
                </ul>
            </div>
        </div>        
        <div class="base_top"><!-- base_top begin -->
            
            <div class="search_box search_goback" id="search_box"><!-- search_box begin -->
                
                    <div class="search-title"><h3 class="flight-tit">Search Flights</h3></div>
                <div class="search_content"><!-- search_content begin -->
                       <!-- <div class="left">hhh</div> -->
                    <div class="middle">
                     <form action="" id="fmHomePage" method="">
                        <div class="search_form"><!-- search_form begin -->
                            <div class="form_group search_type"><!-- form_group  begin -->
                                <label class="form_title"style="display:block;width:40px;">Type</label>
                                <div class="flight_type" id="search_type"><!-- form_fields begin -->
                                    <label><input type="radio" id="oneway"class="input_radio" value="S" name="FlightWay" checked="checked" onclick="onewayClick()" />One Way</label>
                                    <label><input type="radio" id="return"class="input_radio" value="D" name="FlightWay" onclick="returnClick()"  />Return Trip</label>
                                    <label><input type="radio" id="multi"class="input_radio" value="M" name="FlightWay"onclick="multiClick()" />Multi City</label>
                                    
                                </div><!-- form_fields end -->
                            </div><!-- form_group  end -->
                            <div class="search_baseform"><!-- search_baseform begin -->
                                <div class="form_group">
                                    <label class="form_title">From</label>
                                    <div class="form_fields">
                                        <input type="text"  class="input_txt" id="homeCity"  name="homecity_name"placeholder="Enter a name of City / Airport" onchange="RecordCityOrAirport()"/>
                                    </div>
                                </div>
                                <div class="form_group">
                                    <label class="form_title">To</label>
                                    <div class="form_fields">
                                        <input type="text"  class="input_txt" id="destCity" name="destcity1_name" placeholder="Enter a name of City / Airport"onchange="RecordCityOrAirport()"/>
                                    </div>
                                </div>
                                <div class="form_group">
                                    <label class="form_title">Depart</label>
                                    <div class="form_fields">
                                        <input type="datetime-local" class="input_txt" id="DDate"  name="DDatePeriod1"  />
                                    </div>
                                </div>
                                <div class="form_group item2">
                                    <label class="form_title">Return</label>
                                    <div class="form_fields">
                                        <input type="datetime-local" class="input_txt" id="ADate"  name="ADatePeriod1" disabled="true"/>
                                    </div>
                                </div>
                                <div id="search_traveler_types">
                                    <div class="search-traveler-types">
                                        <div class="clearfix">
                                            <label class="form_title">People</label>
                                            <div class="form_group item-first">
                                                <div class="form_fields">
                                                    <select id="Quantity" name="Quantity">
                                                            <option value="Adult1">Adult 1(12+)</option>
                                                            <option value="Adult2">Adult 2</option>
                                                            <option value="Adult3">Adult 3</option>
                                                            <option value="Adult4">Adult 4</option>
                                                            <option value="Adult5">Adult 5</option>
                                                            <option value="Adult6">Adult 6</option>
                                                            <option value="Adult7">Adult 7</option>
                                                            <option value="Adult8">Adult 8</option>
                                                            <option value="Adult9">Adult 9</option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="form_group">
                                                <div class="form_fields">
                                                    <select id="ChildQuantity" name="ChildQuantity">
                                                            <option value="Child0">Child 0(2:11)</option>
                                                            <option value="Child1">Child 1</option>
                                                            <option value="Child2">Child 2</option>
                                                            <option value="Child3">Child 3</option>
                                                            <option value="Child4">Child 4</option>
                                                            <option value="Child5">Child 5</option>
                                                            <option value="Child6">Child 6</option>
                                                            <option value="Child7">Child 7</option>
                                                            <option value="Child8">Child 8</option>
                                                            <option value="Child9">Child 9</option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="form_group">
                                                <div class="form_fields">
                                                    <select id="InfantQuantity" name="InfantQuantity">
                                                            <option value="Infant0">Infant 0(2-)</option>
                                                            <option value="Infant1">Infant 1</option>
                                                            <option value="Infant2">Infant 2</option>
                                                            <option value="Infant3">Infant 3</option>
                                                            <option value="Infant4">Infant 4</option>
                                                            <option value="Infant5">Infant 5</option>
                                                            <option value="Infant6">Infant 6</option>
                                                            <option value="Infant7">Infant 7</option>
                                                            <option value="Infant8">Infant 8</option>
                                                            <option value="Infant9">Infant 9</option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="search_advform" id="search_advform"><!-- search_advform begin -->
                                <div class="form_group" id="SubClass">
                                    <div class="form_title">Class</div>
                                    <div class="form_fields">
                                        <select id="drpSubClass" name="drpSubClass">
                                            <option>Economy</option>
                                            <option>Business</option>
                                            <option>First</option>
                                        </select>
                                    </div>
                                </div>
                                
                            </div><!-- search_advform end -->
                                <div class="form_group non_stop">
                                    <div class="Nonstop">
                                    <label ><input type="checkbox" class="input_checkbox" id="flight_direct"  name="flight_direct" value="1"/><span>Non-stop Only</span></label>
                                    </div>
                                </div> 
                            </div><!-- search_baseform end -->
                            <div class="search_flight">
                                <a href="#"class="search">Search a Flight</a>
                            </div>
                        </div><!-- search_form end -->

                     </form>

                    </div>
                    
                 <div class="multi_search_content" style="display:none;"><!-- multi_search begin   -->
                           <div class="search_form">
                               <div class="form_group search_type"><!-- form_group  begin -->
                                <label class="form_title"style="display:block;width:40px;">Type</label>
                                <div class="flight_type" id="search_type"><!-- form_fields begin -->
                                    <label><input type="radio" id="hide_oneway"class="input_radio" value="S" name="FlightWay"onclick="hide_onewayClick()"/>One Way</label>
                                    <label><input type="radio" id="hide_return"class="input_radio" value="D" name="FlightWay" onclick="hide_returnClick()"/>Return Trip</label>
                                    <label><input type="radio" id="hide_multi"class="input_radio" value="M" name="FlightWay" checked="checked"onclick="hide_multiClick()"/>Multi City</label>
                                    
                                </div><!-- form_fields end -->
                            </div><!-- form_group  end -->
                               <div class="search_content" id="multi_search_content"><!-- multi_form begin -->
                                   <div class="1">
                                       <div class="multi_form_group">
                                           <span>Flight 1:</span>
                                           <label class="multi_label">Depart</label>
                                           <input type="datetime-local" class="multi_form_content" id="homeCity" name="homecity_name"/>
                                           <label class="multi_label">From</label>
                                           <input type="text" class="multi_form_content" id="multi_homeCity" name="homecity_name"placeholder="Enter City / Airport" onchange="Multi_RecordCityOrAirport()"/>
                                           <label class="multi_label">To</label>
                                           <input type="text" class="multi_form_content" id="multi_destCity" name="destCity_name"placeholder="Enter City / Airport"onchange="Multi_RecordCityOrAirport()"/>
                                       </div>
                                   </div>
                                   <div class="2">
                                       <div class="multi_form_group">
                                           <span>Flight 2:</span>
                                           <label class="multi_label">Depart</label>
                                           <input type="datetime-local" class="multi_form_content" id="homeCity" name="homecity_name"/>
                                           <label class="multi_label">From</label>
                                           <input type="text" class="multi_form_content" id="homeCity" name="homecity_name"placeholder="Enter City / Airport"/>
                                           <label class="multi_label">To</label>
                                           <input type="text" class="multi_form_content" id="destCity" name="destCity_name"placeholder="Enter City / Airport"/>
                                           
                                       </div>
                                   </div>
                                   <div class="3">
                                       <div class="multi_form_group">
                                           <span>Flight 3:</span>
                                           <label class="multi_label">Depart</label>
                                           <input type="datetime-local" class="multi_form_content" id="homeCity" name="homecity_name"/>
                                           <label class="multi_label">From</label>
                                           <input type="text" class="multi_form_content" id="homeCity" name="homecity_name"placeholder="Enter City / Airport"/>
                                           <label class="multi_label">To</label>
                                           <input type="text" class="multi_form_content" id="destCity" name="destCity_name"placeholder="Enter City / Airport"/>
                                       </div>
                                   </div>
                               </div><!-- multi_form end -->
                                <div class="search_multiform" id="search_multi"><!-- search_multiform begin -->
                                <div id="flight_multiple"></div>
                                <div class="form_group" id="multform_last">
                                    <a href="javascript:void()" class="add_trip" id="addTrip"onclick="addFrom()"><h2 style="display:inline-block;margin:0;padding:0;" >+</h2>AddForm</a>
                                </div>
                                <div id="flight_multiple_traveler_types"></div>
                            </div><!-- search_multiform end -->
                               <div class="addition"><!-- addition begin -->
                                   <div id="search_traveler_types">
                                    <div class="search-traveler-types"><!-- search-traveler-types begin -->
                                        <div class="clearfix"><!-- clearfix begin -->
                                            <label class="form_title multiTitle">People</label>
                                            <div class="form_group item-first"><!-- form_group begin -->
                                                <div class="form_fields">
                                                    <select id="Quantity" name="Quantity">
                                                            <option value="Adult1">Adult 1(12+)</option>
                                                            <option value="Adult2">Adult 2</option>
                                                            <option value="Adult3">Adult 3</option>
                                                            <option value="Adult4">Adult 4</option>
                                                            <option value="Adult5">Adult 5</option>
                                                            <option value="Adult6">Adult 6</option>
                                                            <option value="Adult7">Adult 7</option>
                                                            <option value="Adult8">Adult 8</option>
                                                            <option value="Adult9">Adult 9</option>
                                                    </select>
                                                </div>
                                            </div><!-- form_group end -->
                                            <div class="form_group"><!-- form_group begin -->
                                                <div class="form_fields">
                                                    <select id="ChildQuantity" name="ChildQuantity">
                                                            <option value="Child0">Child 0(2:11)</option>
                                                            <option value="Child1">Child 1</option>
                                                            <option value="Child2">Child 2</option>
                                                            <option value="Child3">Child 3</option>
                                                            <option value="Child4">Child 4</option>
                                                            <option value="Child5">Child 5</option>
                                                            <option value="Child6">Child 6</option>
                                                            <option value="Child7">Child 7</option>
                                                            <option value="Child8">Child 8</option>
                                                            <option value="Child9">Child 9</option>
                                                        
                                                    </select>
                                                </div>
                                            </div><!-- form_group end -->
                                            <div class="form_group"><!-- form_group begin -->
                                                <div class="form_fields">
                                                    <select id="InfantQuantity" name="InfantQuantity">
                                                            <option value="Infant0">Infant 0(2-)</option>
                                                            <option value="Infant1">Infant 1</option>
                                                            <option value="Infant2">Infant 2</option>
                                                            <option value="Infant3">Infant 3</option>
                                                            <option value="Infant4">Infant 4</option>
                                                            <option value="Infant5">Infant 5</option>
                                                            <option value="Infant6">Infant 6</option>
                                                            <option value="Infant7">Infant 7</option>
                                                            <option value="Infant8">Infant 8</option>
                                                            <option value="Infant9">Infant 9</option>
                                                    </select>
                                                </div>
                                            </div><!-- form_group end -->

                                            <div class="form_fields"style="display:inline-block;"><!-- form_fields begin -->
                                                <div class="form_title multiTitle">Class</div>
                                                <select id="drpSubClass" name="drpSubClass">
                                                    <option>Economy</option>
                                                    <option>Business</option>
                                                    <option>First</option>
                                                </select>
                                            </div><!-- form_fields end -->
                                        </div><!-- clearfix end -->
                                        
                                    </div><!-- search-traveler-types end -->
                                </div>
                                    
                               </div><!-- addition end -->
                               <div class="search_flight">
                                <a href="#"class="search">Search a Flight</a>
                            </div>
                           </div>
                       </div><!-- multi_search end   -->
                </div><!-- search_content end -->
        </div><!-- search_box end -->        
    </div><!-- base_top end -->
<textarea id="rn01" name="textarea" rows="100%" cols="100%"></textarea> <br />
<input style="cursor: hand" onclick="runEx(‘rn01‘)" type="button" value="Run">
<script type="text/javascript">
function runEx(cod1) {
  cod=document.all(cod1)
  var code=cod.value;
  if (code!=""){
    var newwin=window.open(‘‘,‘‘,‘‘); //open a new window newwin。
    newwin.opener = null 
    newwin.document.write(code); //output code in new window
    newwin.document.close();
  }
}
     //respond for choice of didfferent type flight
function onewayClick() { 
    $("#ADate").attr(‘disabled‘, true);
    $("#return").removeAttr("checked");
     $("#multi").removeAttr("checked");
    $("#oneway").attr("checked", "checked");
    $("#oneway").click();    
} 
function returnClick() { 
    $("#ADate").attr(‘disabled‘, false);
    $("#oneway").removeAttr("checked");
     $("#multi").removeAttr("checked");
    $("#return").attr("checked", "checked");
    $("#return").click();    
}    
function multiClick() { 
    $(".middle").hide();
    $(".multi_search_content").show();
    $("#hide_oneway").removeAttr("checked");
     $("#hide_multi").removeAttr("checked");
    $("#hide_multi").attr("checked", "checked");
    $("#hide_multi").click();    
}
function hide_onewayClick() { 
     $(".multi_search_content").hide();
    $(".middle").show();
    $("#ADate").attr("disabled",true);
    $("#return").removeAttr("checked");
     $("#multi").removeAttr("checked");
    $("#oneway").attr("checked", "checked");
    $("#oneway").click();
 } 
 function hide_returnClick() { 
    $(".multi_search_content").hide();
    $(".middle").show();
    $("#ADate").attr(‘disabled‘, false);
    $("#oneway").removeAttr("checked");
    $("#multi").removeAttr("checked");
    $("#return").attr("checked", "checked");
    $("#return").click();
} 
                                        
                                                                        
/*keep input ‘homeCity‘ and ‘multi_homeCity‘、‘destCity‘ and ‘multi_destCity‘ the same when value changed*/
function RecordCityOrAirport(){
    var homeCity_value=$("#homeCity").value;
    var destCity_value=$("#destCity").value;
    $("#multi_homeCity").value=homeCity_value;
    $("#multi_destCity").value=destCity_value;

}
function Multi_RecordCityOrAirport(){
    var multi_homeCity_value=$("#multi_homeCity").value;
    var multi_destCity_value=$("#multi_destCity").value;
    $("#homeCity").value=multi_homeCity_value;
    $("#destCity").value=multi_destCity_value;
}

/*insert a new form*/
function addFrom(){
    
    var element=document.getElementById("multi_search_content");
    var topdiv=document.createElement("div");
    var newForm=document.createElement("div");
    newForm.className="multi_form_group";
    var len=element.getElementsByClassName(‘multi_form_group‘).length+1;

    var newSpan=document.createElement("span");
    var spanNode=document.createTextNode("Flight "+len+": ");
    newSpan.appendChild(spanNode);
    newForm.appendChild(newSpan);
    
    var newLabel=document.createElement("Label");
    var labelNode=document.createTextNode(" Depart ");
    newLabel.appendChild(labelNode);
    newForm.appendChild(newLabel); 
    var newInput=document.createElement("input");
    newInput.className=‘multi_form_content‘;
    newInput.type=‘datetime-local‘;
    newInput.placeholder=‘Enter City / Airport‘;
    newForm.appendChild(newInput);
    
    var newLabel=document.createElement("Label");
    var labelNode=document.createTextNode(" From ");
    newLabel.appendChild(labelNode);
    newForm.appendChild(newLabel);
    var newInput=document.createElement("input");
    newInput.className=‘multi_form_content‘;
    newInput.type=‘text‘;
    newInput.placeholder=‘Enter City / Airport‘;
    newForm.appendChild(newInput);

    var newLabel=document.createElement("Label");
    var labelNode=document.createTextNode(" To ");
    newLabel.appendChild(labelNode);
    newForm.appendChild(newLabel);
    var newInput=document.createElement("input");
    newInput.className=‘multi_form_content‘;
    newInput.type=‘text‘;
    newInput.placeholder=‘Enter City / Airport‘;
    newForm.appendChild(newInput);
    
    var newLabel=document.createElement("a");
    var labelNode=document.createTextNode(" X ");

    topdiv.className=len;
    topdiv.appendChild(newForm);
    element.appendChild(topdiv);

    /*method 2: cloneNode
        var sourceNode = document.getElementById("div-0"); // get a node object 
        var clonedNode = sourceNode.cloneNode(true); // clone node 
        clonedNode.setAttribute("id", "div-" + i); // correct id，avoid repeating 
        sourceNode.parentNode.appendChild(clonedNode); // insert from parentNode 
    */

}

</script>
</body>
</html>

 

SearchFlight_Joker

标签：

原文地址：http://www.cnblogs.com/JokerFangBlog/p/Joker_SearchFlight.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！