다른 스크립트에 포함 된 파일의 내용을 변경하는 방법은 무엇입니까?

다른 페이지의 다른 줄에 페이지의 활성 속성을 만들어야하는 웹 사이트를 만들고 있습니다. 이제 전체 공통 스크립트를 파일 헤더에 넣고 모든 스크립트에 포함합니다. 이제 라인의 내용을 다른 페이지에 포함시킬 때 어떻게 변경합니까? 다음과 같이다른 스크립트에 포함 된 파일의 내용을 변경하는 방법은 무엇입니까?

헤더는 다음과 같습니다

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Bootstrap 101 Template</title> 

    <!-- Bootstrap --> 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 
    <link href="islamic.css" rel="stylesheet"> 
    <link href='http://fonts.googleapis.com/css?family=Lato:400,300italic' rel='stylesheet' type='text/css'> 
    <!-- HTML5 Shim and Respond.js 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]--> 
    <style> 
    html,body 
    { 
      height: 1500px; 
    } 
    .grey 
     { 
     background-color: #ccc; 
     padding: 20px; 
     } 
    </style> 
    </head> 
    <body> 
     <!-- We are going to make this page for navigation purpose --> 

     <nav class="navbar navbar-inverse navbar-fixed-top" role = "navigation"> 
       <div class="navbar-header"> 
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
         <span class="icon-bar"> </span> 
         <span class="icon-bar"> </span> 
         <span class="icon-bar"> </span> 

        </button> 
        <a class="navbar-brand" href="index.php">ILM</a> 
       </div> 

       <div class="navbar-collapse collapse"> 
        <ul class="nav navbar-nav"> 
         <li ><a href="index.php">Home</a></li> 
         <li ><a href="why.php">Discuss</a></li> 
         <li ><a href="aboutus.php">About Us</a></li> 
         <li ><a href="contacts.php">Contact</a></li> 
         <li class="dropdown"> 
          <a href="#" class="dropdown-toggle" data-toggle="dropdown"> Social <b class="caret"> </b></a> 
          <ul class="dropdown-menu"> 
          <li> <a href="http://www.facebook.com">Facebook</a></li> 
          <li> <a href="#">Twitter</a></li> 
          <li> <a href="#">Linked IN</a></li> 
          <li> <a href="#">You Tube</a></li> 
          </ul> 
          </li> 
        </ul> 
       </div> 
     </nav>

내가 홈 페이지

<li class="active"><a href="index.php">Home</a></li>

에 선

<li ><a href="index.php" >Home</a></li>

을 변경하고 싶습니다. 는 지금은 우리에 대해 페이지

<li class="active"><a href="aboutus.php">Home</a></li>

에 선

<li ><a href="aboutus.php" >About Us</a></li>

을 변경하고 싶습니다. PHP로 가능합니까?

출처

2014-09-09 jahan

어떤 웹 사이트 유형입니까? 내 말은 집과 같은 메뉴를 클릭하면, 연락처, 토론 또는 기타가 전체 페이지를 새로 고치거나 부분적으로 새로 고침을하는 것입니까? – HaBo

전체 페이지를로드해야합니다. 네비게이션 바입니다. 이제 다른 페이지로 이동하면서 다른 항목을 활성화하고 싶습니다. – jahan

당신은 당신의 </body> 태그의 끝에서이

http://jsfiddle.net/habo/arjw2q6b/

같은 장소에서이 코드를 somethign 시도 할 수 있습니다. 페이지 추측 URL에는 앵커 태그 href가 있습니다. 하나의 각 페이지로드 후 전체 문서 ID를 읽으면 스크립트는 URL에 "index.php"또는 다른 모든 href가 있는지 확인하고 그럴 경우 해당 함수가 모든 목록 항목 (li)에 대한 활성 클래스를 제거하는 resetActiveTab 함수를 호출합니다) 현재 페이지에 class=active을 추가하십시오.

$(function(){ 
    if(window.location.href.contains("index.php")){ 
     resetActiveTab("index.php"); 
    } 
    else if(window.location.href.contains("why.php")){ 
     resetActiveTab("why.php"); 
    } 
    else if(window.location.href.contains("aboutus.php")){ 
     resetActiveTab("aboutus.php"); 
    } 
} 
function resetActiveTab(mySelector){ 
    $(".navbar-nav li").each(function(key, value) { 
    //alert($(value).attr("class")); 
    $(value).removeClass("active"); 
     if($(value).find("a").attr("href") == mySelector){ 
      $(value).addClass("active"); 
     } 
    }); 
}

출처

2014-09-09 17:32:54 HaBo

조금 설명해 주시겠습니까? – jahan

내 대답이 업데이트되었습니다. 참고하시기 바랍니다 : 에 jQuery 참조를 추가해야합니다. – HaBo

다른 스크립트에 포함 된 파일의 내용을 변경하는 방법은 무엇입니까?

답변

관련 문제