2013-11-10 3 views
1

Привет, я застрял в своей текущей работе из-за этой проблемы с кнопкой отмены.Отмена кнопки HTML jQuery

Здесь я объясню мои проблемы с некоторыми экранами шорты enter image description here

Это моя первая страница, когда РМКО нажмите на первую кнопку радио [Unique] он идет к этому

enter image description here

Здесь я хочу, когда я нажму кнопку отмены, он вернется к первому экрану, но когда я нажму, он сделает это как

enter image description here Это ма полный код

<head> 
    <meta charset="utf-8" /> 

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery- 
ui.css" /> 
<script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
<style> 
    .raddiv{ 
     height: 30px;   
    } 
    .sitehtn{ 
    display: none 
      }   

    .container  
    { 
    width: 100%; 
    height: 600px; 
    background-color: rgb(179, 174, 174);   
    } 

    #datepickerT 
    { 
    margin-left: 2em; 
    } 

    .eventDateDiv 
    { 
    height: 150px; 
    width: 65%; 
    margin-left: auto; 
    margin-right: auto; 
    } 
    #daysBetween 
    { 
    margin-top: -1.4em; 
    margin-left: 30%; 
    } 
    .eventShowDiv 
    { 
    height: 306px; 
    width: 65%; 
    margin-left: auto; 
    margin-right: auto; 

    } 
    .event{ 
    color: green; 
    margin-top: 5px;} 
    </style> 
    <script> 
      $(function() { 
     $("#datepickerF").datepicker({ 
      showOn: "button", 
      buttonImage: "calendar.gif", 
      buttonImageOnly: true 
     }); 

    $("#datepickerT").datepicker({ 
       showOn: "button", 
      buttonImageOnly: true 
     }); 
$('#getdays').click(function() { 
    var start = $('#datepickerF').datepicker('getDate'); 
     var end = $('#datepickerT').datepicker('getDate'); 
     var days = (end - start)/1000/60/60/24; 
     document.getElementById("daysBetween").innerText=days; 

      }); 

    $(".radioBtn").click(function() { 
    $(".textBox").hide(); 
    if ($(this).attr("id") == "courtierRadio") { 
    $("#faderad").fadeOut(); 
    var is= $("#txt1, #txt2,#txt3,#getmrr,#rmvmrr") 
    is.show(); 

    } else if ($(this).attr("id") == "agenceRadio") { 
     $("#fadfirst").fadeOut(); 
    var vs=$("#txt5,#txt6,#txt7,#txt8").show(); 
    vs.show(); 
    } 

    }); 
     $("#getmrr").click(function() { 
     $('#mytable tbody>tr:last').clone(true).insertAfter('#mytable tbody>tr:last'); 
     return false; 

    }); 
    $("#rmvmrr").click(function() { 

     $("#mytable").remove(); 

     return false; 

    }); 
     function myFunction() 
     { 
     $("#getmrr").append(is); 
     } 
     }); 

     </script> 
       </head> 
     <body> 
    <div class="container"> 

     <div class="eventDateDiv"> 
      <div class="event"> 
       EVENT DATE 
      </div> 

      <p>FROM: <input type="text" id="datepickerF" /></p> 
      <p>To: <input type="text" id="datepickerT" /></p> 


      <button id="getdays">NO.OF DAYS </button> 
      <p id="daysBetween"> </p> 

     </div> 
     <div class="eventShowDiv"> 
      <div class="event"> 
       EVENT SHOW TIME 
      </div> 
      <p>TYPE OF SHOW: </p> 
    <div id="fadfirst" class="raddiv">   
       <label> 
     <input type="radio" name="sitewebGroup" value="Courtier" id="courtierRadio" 
    class="radioBtn" />Unique 
    </label> 
     <table id="mytable" width="500" > 
    <tbody> 
    <tr> 
<td> 
    <input type="text" name="site" class="sitehtn" id="txt1" /> 
    <input type="text" name="site" class="sitehtn" id="txt2" /> 
     <input type="text" name="site" class="sitehtn" id="txt3" /> 
    </td> 
    </tr> 
    </tbody> 
     </table> 
     <button id="getmrr" class="sitehtn" >addmore</button> 
     <button id="rmvmrr" class="sitehtn" >Cancel</button> 

    <br /> 
    </div> 
    <div id="faderad"> 
     <label> 
     <input type="radio" name="sitewebGroup" value="Agence" id="agenceRadio" 
    class="radioBtn" /> 
    Varied 
    </label> 

    <input type="text" name="textfield3" class="sitehtn" /> 

     <input type="text" name="textfield" class="sitehtn" id="txt5" /> 
      <input type="text" name="textfield" class="sitehtn" id="txt6" /> 
     <input type="text" name="textfield" class="sitehtn" id="txt7" /> 
      <input type="text" name="textfield" class="sitehtn" id="txt8" />    
</div>     
     </div> 
    </div> 
     </body> 
     </html> 

Иам просто newcommer к этому так, пожалуйста, предоставить некоторые руководящие с valueble комментарии

+0

Select -> Crop Image -> сохранить как;) –

ответ

1

Вам необходимо сообщить браузеру, чтобы показать Опция «Разнообразная» и скрыть кнопки «addmore» и «Cancel».

Изменить событие щелчка связанного с кнопкой отмены от

$("#rmvmrr").click(function() { 

    $("#mytable").remove(); 

    return false; 

}); 

в

$("#rmvmrr").click(function() { 

    $("#mytable").remove(); 
    $("#faderad").show(); 
    $("#getmrr").hide(); 
    $("#rmvmrr").hide(); 

    return false; 

}); 

Рабочий пример here

+0

Thankx ... Buddy ... Code works :-) – Manu

0

Я думаю, что

$("#rmvmrr").click(function() { 

     $("#mytable").remove(); 

     return false; 

    }); 

к:

$("#rmvmrr").click(function() { 

     $("#mytable").hide(); 

     return false; 

    }); 

сделал бы трюк, чтобы скрыть это.

, если вы хотите, чтобы удалить его: Я хотел бы сказать, переместить кнопки вверх в таблице, так как они находятся вне тега, и сказать:

$("#myTable").html(""); 
+0

: Thankx для ваш быстрый повтор, я отредактировал свой код с вашим, но он все равно дает мне вывод, который я показывал на третьем экране. Я просто хочу, чтобы, когда я нажимаю кнопку cancel butto n он обращается к экрану коротко 1. Возможно ли это. – Manu

+0

Я думаю, что независимо от того, что вам нужно переместить две кнопки на несколько строк, чтобы они были перед тегом. Позвольте мне переустановить код, чтобы я мог снова установить флажок! – samuraiseoul

+0

Есть ли причина, по которой вы используете таблицы? – samuraiseoul

Смежные вопросы