如何用ajax在jquery中显示div。 [英] how to display div in jquery with ajax.

问题描述

我想使用jquery和ajax显示隐藏的div。

代码是：

 < span class =code-keyword><   style  >  
 #hidden 
 {
 display：none; 
} 
 <   / style  >  

< script type =text / javascript> 
 $（document）.ready（function（）{
 
 $（'＃cal'）。datepicker（）; 
 $（'＃cal1'）。datepicker（） ; 
 
 $（。btn1）。click（function（）{
 
 var strtdt = $（'＃cal'）。val（）; 
 var enddt = $（'＃cal1'）。val（）; 
 var crg = $（'＃charge'）。val（）; 
 alert（strtdt）; 
 alert（enddt ）; 
 alert（crg）; 
 $ .ajax（{
 
 type：GET，
 url：fun_action.php，
 data：{strtdt：strtdt，enddt：enddt，crg：crg}，
 success：function（data）{
 location.reload（）; 
 document.getElementById（'hidden'）。 style.display =block; 
 $（'＃hidden'）。fadeIn（3000）; 
} 
}）; 
 
}）; 
 
}）; 
< / script> 

<？ 
 $ select =   select * from tbl_client c，tbl_function f其中
 c.res_id = f .res_id和
 f.fun_id ='$ _ GET [id]'; 
 $ query = mysql_query（ $ select ）; 
 $ result = mysql_fetch_array（ $ query ）; 
？> 

 <  表格   方法  =  post    名称  = < span class =code-keyword> frm >  
 <  表    class   =  detail_tbl >  
 <   tr  >  
 <   td     rowspan   =  3    class   =  admin_tr >  <   img    < span class =code-attribute> src   = <？ echo $ result ['fun_img']; ？>    height   =  280px    width   =  250px >  <   / td  >  
 <   td    类  =  admin_tr   样式  =  text-transform：uppercase ; text-decoration：下划线; >  <？    echo     $ result [ 'fun_name'];    ？ >  <   / td  >  
 <   / tr  >  
 <   tr  > ;  
 <   td     class   =  admin_tr    width   =  100％ >  <？    echo     $ result ['fun_desc'];    ？ >  < ;   / td  >  
 <   / tr  >  
 <   tr  >  
 <  输入    type   = 隐藏    id   =  费用    value  < span class =code-keyword> = <？ echo $ result ['fun_charge']; ？> >  
 <   td     class   =   admin_tr    width  < span class =code-keyword> =  400px > 费用：< span class =code-summarycomment><？    echo     $ result ['fun_charge'];    ？ >  <   br     /  >  <   br     /  >  
 <   span     class   =  admin_tr < span class =code-attribute>   style   =  margin-left：-20px; > 签入：& nbsp;& nbsp;& nbsp; <  输入   类型  =  text    class   = 文本框   名称  =  txt_from    style   =  width：200px;    id   =  cal  /  >  <   / span  >  
 <   br     /  > ;  <   br  >  
 <   span     class   =  admin_tr    style   =  margin-left：-20px; > 签出：<  输入    type   =  text    class   =  textbox   名称  =  txt_from    style   =  width：200px;    id   =  cal1  /  >  
 <   / span  >  
 
 <   br  >  <   br  >  
 <  输入   类型  = 提交   名称  =  btn_submit    value   = 保存      class   =  btn1  /  >  
 
 <   / td  >  
 <   / tr  >  
 
 
 <   / table  >  
 <   div     id   =  隐藏 >  
总费用：<  输入    type   =  text   < span class =code-attribute> value   =  123 >  
 <   / div  >  
 
 
 
 <   / form  >  

解决方案

（document）.ready（function（）{

（'＃cal'）。datepicker（）;

< 。BR />

（ '＃CAL1'）日期选择器（）;

i want to display hidden div using jquery with ajax.
code is:

<style>
#hidden
{
    display:none;
}
</style>

<script type="text/javascript">
$(document).ready(function(){
	
	$('#cal').datepicker();		
	$('#cal1').datepicker();
	
	$(".btn1").click(function(){
									
				var strtdt=$('#cal').val();
				var enddt=$('#cal1').val();
				var crg=$('#charge').val();
				alert(strtdt);
				alert(enddt);
				alert(crg);
				$.ajax({
					   
					   type:"GET",
					   url:"fun_action.php",
					   data:{strtdt:strtdt,enddt:enddt,crg:crg},
					   success:function(data){
						location.reload();
						document.getElementById('hidden').style.display = "block";
					$('#hidden').fadeIn(3000);
					   }
					   });
				
			});
	
  	});
</script>

<?
    $select="select * from tbl_client c, tbl_function f where
    c.res_id=f.res_id and
    f.fun_id='$_GET[id]'";
    $query=mysql_query($select);
    $result=mysql_fetch_array($query);
?>

<form method="post" name="frm">
   <table class="detail_tbl">
           <tr>
               <td rowspan="3" class="admin_tr"><img src="<? echo $result['fun_img']; ?>" height="280px" width="250px"></td>
               <td class="admin_tr" style="text-transform:uppercase; text-decoration:underline;"><? echo $result['fun_name']; ?></td>
           </tr>
           <tr>
           <td class="admin_tr" width="100%"><? echo $result['fun_desc']; ?></td>
           </tr>
           <tr>
           <input type="hidden" id="charge" value="<? echo $result['fun_charge']; ?>">
           <td class="admin_tr" width="400px">Charge:<? echo $result['fun_charge']; ?><br /><br />
          <span class="admin_tr" style="margin-left:-20px;">Check In:&nbsp;&nbsp;&nbsp;<input type="text" class="textbox" name="txt_from" style="width:200px;" id="cal"/></span>
           <br /><br>
            <span class="admin_tr" style="margin-left:-20px;">Check Out:<input type="text" class="textbox" name="txt_from" style="width:200px;" id="cal1"/>
            </span>

           <br><br>
       <input type="submit" name="btn_submit" value="Save"  class="btn1"/>

           </td>
           </tr>


           </table>
              <div id="hidden">
           Total Charge:<input type="text" value="123">
       </div>



   </form>

解决方案

(document).ready(function(){

('#cal').datepicker();

('#cal1').datepicker();

这篇关于如何用ajax在jquery中显示div。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！