带有$（“html”）.html（数据）的jquery.post，主体css不起作用_Jquery_Css_Forms_Post

带有$（“html”）.html（数据）的jquery.post，主体css不起作用

jquery css forms post

带有$（“html”）.html（数据）的jquery.post，主体css不起作用,jquery,css,forms,post,Jquery,Css,Forms,Post,我正在使用以下代码提交表单： function submitfilter(){ alert("in here"); var o = $("#opentimes").val(); var p = $("#price").val(); var d = $("#distance").val(); var t = $("#type").val(); $.post("eateries.php", { opentimes: o, price: p, distance: d, type: t },

我正在使用以下代码提交表单：

function submitfilter(){
 alert("in here");
 var o = $("#opentimes").val();
 var p = $("#price").val();
 var d = $("#distance").val();
 var t = $("#type").val();
 $.post("eateries.php", { opentimes: o, price: p, distance: d, type: t }, function(data) { $("html").html(data); } );
 return false;
}

我在eateries.php上运行这个，所以正如您所看到的，我希望像常规表单提交一样重新加载相同的页面。除了我的一些CSS不起作用之外，一切都很好。具体而言：

body{font-family:Arial, Helvetica, sans-serif; font-size:14px; margin:0px;color:red;}

CSS的其余部分似乎工作正常。这是怎么回事

编辑：我应该提到的另一件事是CSS确实可以工作一秒钟。。这里的alertin是向上的，文本是Arial和红色。但是，在我点击Ok之后，字体会回到黑色衬线

谢谢

编辑：这是要求的标题部分

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width"/>
<title>Eateries Gadget</title>
<link href="styles.css" rel="stylesheet" type="text/css">

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
//alert ("you're using "+navigator.platform);
if(navigator.platform == 'iPhone' || navigator.platform == 'iPod')
{
 //alert("it's an iphone!");
 $(function(){ 
  $("body").css("font-size", "16px");
/* $("#footer").css("background-color", "blue");
     $("#footer").css("position", "static");*/
   $("select").css("font-size", "16px");
  $("input.btn").css("font-size", "14px");
  }); 
};

navigator.geolocation.getCurrentPosition(foundLocation, noLocation);

function foundLocation(position)
{
 var currLat = position.coords.latitude;
 var currLng = position.coords.longitude;
 //alert('Found location: ' + lat + ', ' + lng);
}
function noLocation()
{
 alert('Could not find your location.');
 var currLat = null;
 var currLng = null;
}

</script>

<script type="text/javascript">


function submitfilter(){
 alert("in here");
 var o = $("#opentimes").val();
 var p = $("#price").val();
 var d = $("#distance").val();
 var t = $("#type").val();
 $.post("eateries.php", { opentimes: o, price: p, distance: d, type: t }, function(data) { $("html").html(data); } );
 return false;
}


 function setstate(opentimes,price,distance,type){
  for(var i = 0; i < document.filters.opentimes.options.length; i++) {
   if(document.filters.opentimes.options[i].value == opentimes){
    document.filters.opentimes.selectedIndex = i;
    break;
   }
  }
  for(var i = 0; i < document.filters.price.options.length; i++) {
   if(document.filters.price.options[i].value == price){
    document.filters.price.selectedIndex = i;
    break;
   }
  }
  for(var i = 0; i < document.filters.distance.options.length; i++) {
   if(document.filters.distance.options[i].value == distance){
    document.filters.distance.selectedIndex = i;
    break;
   }
  }
  for(var i = 0; i < document.filters.type.options.length; i++) {
   if(document.filters.type.options[i].value == type){
    document.filters.type.selectedIndex = i;
    break;
   }
  }
 }
</script>

</head>

假设CSS行与此html文件位于同一目录下的style.CSS中，没有理由相信CSS不起作用，因为您的语法是完全正确的。也许要确保标签正上方有一个正确的doctype

另外，正如Nick在对您的问题的评论中提到的，如果您希望重新加载页面，为什么要使用AJAX？刚刚注意到你关于代理的回复，不过我会先调查一下

更新：你甚至从来没有提到是什么让你觉得CSS不起作用

注意：当您提供更多信息时，我将更新此内容。

您正在替换$.post回调中标记的innerHTML！如果你使用firebug，你可能会注意到身体正在一起消失

一个快速修复方法是在$post回调中以$body而不是$html为目标。否则，创建另一个元素来填充该回调的返回。

您能显示eateries.php的head部分吗？这可能是一个愚蠢的问题，但是如果您加载整个页面，为什么还要在这里使用AJAX呢？我发布了head部分。我之所以使用ajax，是因为我们使用的代理由于某种原因，常规表单提交无法使用它。我在这里一点也不讽刺……你在修复错误的问题，这应该在代理中修复，而不是用脚本来解决它的问题。是的，这就是line在style.css中，它与eateries.php位于同一目录中。我的doctype是：@vee，是什么让你觉得CSS不起作用？这些属性是否没有像您预期的那样应用？因为字体是衬线而不是红色，所以无法工作。我在原来的帖子中添加了一条额外的评论：我可能应该提到的另一件事是CSS确实可以工作一秒钟。。这里的alertin是向上的，文本是Arial和红色。然而，在我点击Ok后，字体会回到黑色衬线。@vee，我发布了另一个答案。让我知道这是否是问题所在。将其更改为body有效，但我不知道为什么！的确，当我在firebug中查看代码时，body标签已经消失了。然而，当我查看源代码时，一切看起来都是正确的。另外，当我执行$.posteateries.php时，{opentimes:o，price:p，distance:d，type:t}，functiondata{console.logdata}；我可以看到，数据包括html、head、body标记和其他所有内容。当您将body设置为数据时，如何只将适当的内容放入其中？我希望这是有意义的。@vee，我认为这可能是因为源代码不显示DOM的更新版本，而Firebug显示DOM的更新版本？关于你的第二个问题，我真的不知道为什么会这样。我想这是一个非常棒的jQuery，但我可能错了。你可以自己检查一下：；无论如何，我很高兴我们找到了问题所在。@vee，$.htmlhtmlString方法将在用新内容替换这些元素之前从子元素中删除其他构造，如数据和事件处理程序。