引导程序会干扰其他 JavaScript 吗？甚至设置 cookie();？答案

【问题标题】：does bootstrap interfere with other JavaScript? Like even set cookie();?引导程序会干扰其他 JavaScript 吗？甚至设置 cookie();？
【发布时间】：2015-09-02 00:05:16
【问题描述】：

我已经很好地工作了，然后我去应用了引导程序。现在不行了。

这是我的一个小博客项目的管理页面，我正在从头开始学习 PHP。这最初是来自 phptoys 的 microNews。我做了很多更改，是的，代码可以更整洁。（我想制作一个“功能”页面，但那是以后的事了）

<?php

if (isset($_COOKIE['submitdate'])) {
$submitDate=$_COOKIE['submitdate'];
}
else {
$submitDate= date('Y-m-d');

}




if (isset($_COOKIE['newstitle'])) {
$newsTitle=$_COOKIE['newstitle'];
} else {
$newsTitle="News Title";

 }


 //Set no caching
 header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
 header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT"); 
 header("Cache-Control: no-store, no-cache, must-revalidate"); 
 header("Cache-Control: post-check=0, pre-check=0", false);
 header("Pragma: no-cache");




 //create or edit file, protect this page from invalid users

 if (!isset($_POST['submit'])) {
 require_once('protector.php'); 

  ?>
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"       "DTD/xhtml1-transitional.dtd">              
 <html>
 <head>
 //bootstrap stuff

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head      content must come *after* these tags -->  <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">


     <title>Basic Boring Blog</title>
    <link href="style/bootstrap.css" rel="stylesheet" type="text/css" />
     <script language="javascript" type="text/javascript" src="js/tiny_mce.js">                </script>
        <script language="javascript" type="text/javascript">
       tinyMCE.init({
      mode : "textareas",
      theme : "advanced",
      theme_advanced_buttons3 : "",
      theme_advanced_toolbar_location : "top",
      theme_advanced_toolbar_align : "left",

    });
</script>



 <script language='javascript' type='text/javascript'>

 //delete that damn cookie

 function click_agree()
 {
 document.cookie = 'newstitle = $newsTitle  ; expires =  2 Aug 1970 20:47:11 UTC;  path=/';
 document.cookie = 'submitdate = $submitDate ; expires = 2 Aug 1970 20:47:11 UTC;  path=/';


 }
 </script> 



 <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
 <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
 <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js">   </script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js">  </script>
<![endif]-->
</head>

<body >

//testing to see what the code knows

//since bootstrap additions, this only outputs "News Title"

<?php echo $newsTitle;?>


</br>

// this outputs nothing

<?php echo $_COOKIE['newstitle'];?>




 <?php 
  $filename = $submitDate.$newsTitle;
  ?>

   <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
   <script    src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">    </script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
   <script src="js/bootstrap.min.js"></script>



  <div id="main2">
  <?php include 'nav.php';
  ?></div>





 <div id="main">





<?php

 //look into the specific file and see what the heck is there


$newsData = file("news/news/".$filename.".txt");


   $newsTitle  = $newsData[0];
     $submitDate = $newsData[1];    
     unset ($newsData['0']);
     unset ($newsData['1']);

     $newsContent = "";
     foreach ($newsData as $value) {
           $newsContent .= $value;
     }




      ?>
     <div class="container-fluid">
     <div class="well">
     <div class="center-block">
     <div class="form-group">
    <form action='<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>'   method='post' >
    <label>News Title</label>
    <br/>
    <input type='text' name='title' size='40' value="<?php echo $newsTitle;?>"/> 
     <br/>
     <br/>
     <label>Write your thoughts here</label>
    <br/>
    <textarea  name='newstext' rows='15' cols='67'  /><?php echo   $newsContent;?></textarea><br/>
    <div class="pull-right"><input type='submit' name='submit' value='Save' onClick='click_agree()' /></div>


 <br/>
  <br/>
   <br/>

 </form> </div></div>



 </div></div>
  </div></div>
<?php include 'footer.php';
 ?> 
 </body>   

 <?php } else {



  //make sure that variables are declared and then post this thing already

  $newsTitle   = isset($_POST['title']) ? $_POST['title'] : 'Untitled';
  if (isset($_COOKIE['submitdate'])) {
   $submitDate=$_COOKIE['submitdate'];
   } else {
   $submitDate= date('Y-m-d');
   $newsContent = isset($_POST['newstext']) ? $_POST['newstext'] : 'No content';

  $filename = $submitDate.$newsTitle;
  $f = fopen('news/news/'.$filename.".txt","w+"); 

 //the page that will be made
  $written ="

  <html>
  <head>
  <meta charset='utf-8'>
   <meta http-equiv='X-UA-Compatible' content='IE=edge'>
   <meta name='viewport' content='width=device-width, initial-scale=1'>
    <!-- The above 3 meta tags *must* come first in the head; any other head     content must come *after* these tags -->
   <link href='style/bootstrap.css' rel='stylesheet' type='text/css' />
   <meta name='viewport' content='width=device-width, initial-scale=1'>
        <title>Basic Boring Blog</title>
        <link href='http://pluckzilla.byethost32.com/microblog/microNews/style/bootstrap.css'   rel='stylesheet' type='text/css' />


      <script language='javascript' type='text/javascript'>
      function click_agree()
 {
document.cookie = 'newstitle = $newsTitle; expires = 2 Aug 2017 20:47:11 UTC;  path=/';
 document.cookie = 'submitdate = $submitDate; expires = 2 Aug 2017 20:47:11 UTC;  path=/';

 window.location.href =    'http://www.pluckzilla.com/microblog/microNews/admin.php';
  }
</script> 






  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
  <script src='https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js'>  </script>
  <script src='https://oss.maxcdn.com/respond/1.4.2/respond.min.js'></script>
 <![endif]-->


 </head>

 <body >



   <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
  <script   src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js'>    </script>
   <!-- Include all compiled plugins (below), or include individual files as needed -->
  <script src='js/bootstrap.min.js'></script>


 <div id=\"main2\">

 <?php include 'nav.php';
 ?> 
  </div>






 <div>
 <div id='main' class='pull-right'>

 <span='title'><h1>$newsTitle</h1></span>
 <span='date'>$submitDate</span>
  <span><p>$newsContent</p></span>

  <button name='edit' onClick='click_agree()'><span class='glyphicon glyphicon-edit' aria-hidden='true'></span></button></div>

我让这个管理页面创建的新页面使用 JavaScript () 加载了 2 个 cookie，然后重定向回管理页面。然后，cookie 将用于调用上述使用 php 创建的页面，并将其加载到表单上，以进行编辑。最后，表单按钮将删除 cookie。

基本上，我启用了管理页面来编辑页面，而不仅仅是创建页面。

然后我添加了引导程序，因为，嗯，它很棒。现在我的管理页面不工作了。

我一定是做错了什么，但我查看了代码，除了引导位之外，一切看起来都和以前一样。我删除了一些引导程序，主要是从表单中删除，因为它是它工作的关键，但它仍然不起作用。

...最重要的是，我的“实时”服务器上的管理页面的代码必须与上面的表单略有不同！作品！只是！美好的！在我的本地主机上。（基于 Windows 7，wamp）。我复制了 WAS 在服务器上运行的代码，并且在添加引导位时小心不要更改它。我无法在本地测试它，唉，我没有成功。

【问题讨论】：

您是否还有一份之前有效的代码副本？
不幸的是没有。我愚蠢地做了假设。
是的，这就是你应该使用版本控制的原因。很遗憾听到这件事发生在你身上。祝你好运。
感谢您的宝贵时间。我将尝试重建我失去的东西
您检查浏览器控制台是否有错误，请在您添加的所有 js 文件上方添加 bootstrap.min.js ......因为有时它会覆盖 Jquery 方法

标签： javascript css forms twitter-bootstrap cookies

【解决方案1】：

简单的答案是

不，CSS 不会干扰 JavaScript。

从本质上讲，JavaScript 能够更改页面中的内容，包括 CSS，有时可能会使 CSS 看起来好像不起作用，而实际上它确实起作用了。（除非您有语法错误，否则 CSS 始终有效并且是完全可预测的。如果它不适用于元素，则意味着它被另一个 CSS 规则或您不知道的内联样式覆盖）。检查您的项目是否在加载了 Bootstrap 的 CSS 的情况下工作（或不工作）的一个非常简单的方法是将此行添加到页面的 head 标记中（先在本地计算机上尝试）并删除所有其他 Bootstrap 引用：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

不过，Bootstrap 也带有 JavaScript。这可能会干扰您页面中的其他 JavaScript，但是，除非您在页面的不同插件/小部件中使用不同版本的 Bootstrap，否则通常不会。从我在上面发布的代码中看到的，您正在使用 Bootstrap 中的 CSS 和 Javascript。所以我想你的问题应该重新表述。

您能否详细解释一下在您的远程服务器上无法运行而在您的本地计算机上运行的是什么？这可能与 JavaScript 无关。大概与Apache或php两台机器的服务差异有关。

【讨论】：

自从这个问题出现以来，我已经做出了巨大的改变。其中，从项目中转储 tinyMCE。是的，我知道引导程序有一个 jquery 组件，谷歌搜索没有发现任何已知问题。因此我的问题在上面。我将 jquery 更新为较新的版本，这似乎有所帮助。那，并再次从原始代码重建代码。我将把它归结为“我有大量错别字”，而不是真正的引导问题。
就其在 css 中的作用而言，Javascript 是非 Web 标准浏览器（如 Internet Explorer）的一种解决方法。或者我认为。我有很多东西要学。