JavaScript-Funktion nach dem Weg zu anderer Seite deaktiviert

i html-Datei, die Komponente wickelt reagieren, ist unter dem Code:JavaScript-Funktion nach dem Weg zu anderer Seite deaktiviert

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="description" content=""> 
    <meta name="author" content=""><!-- 
    <link rel="shortcut icon" href="assets/img/logo-fav.png"> --> 
    <title>Loyalty Multipolar</title> 
    <link rel="stylesheet" type="text/css" href="/lib/perfect-scrollbar/css/perfect-scrollbar.min.css"/> 
    <link rel="stylesheet" type="text/css" href="/lib/material-design-icons/css/material-design-iconic-font.min.css"/> 
    <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> 

    <!--[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]--> 
    <link rel="stylesheet" href="/css/style.css" type="text/css"/> 
    <style type="text/css"> 
     .modal-body { 
      max-height:400px; 
      overflow-y:auto; 
     } 
    </style> 
    </head> 
    <body> 
    <div id="root"> 

    </div> 
    <script src="bundle.js"></script> 

    <script src="/lib/jquery/jquery.min.js" type="text/javascript"></script> 
    <script src="/lib/perfect-scrollbar/js/perfect-scrollbar.jquery.min.js" type="text/javascript"></script> 
    <script src="/js/main.js" type="text/javascript"></script> 
    <script src="/lib/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script> 
    <script src="/lib/jquery.niftymodals/dist/jquery.niftymodals.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
    $.fn.niftyModal('setDefaults',{ 
     overlaySelector: '.modal-overlay', 
     closeSelector: '.modal-close', 
     classAddAfterOpen: 'modal-show', 
    }); 

    $(function(){ 
     Plugins.init(); 
     $('.admin').click(function(){//button modal 
     alert('alert'); 
     }); 
    }); 

    </script> 
    </body> 
</html>

und das ist meine Admin-Seite

import React, {Component} from 'react'; 

import CreateForm from '../Component/Admin/CreateForm'; 

class AdminPage extends Component { 

    render(){ 
    return(
     <div className="be-content"> 
     <CreateForm/> 
     <div className="page-head"> 
      <h2 className="page-head-title">Manage Admin</h2> 
      <ol className="breadcrumb page-head-nav"> 

      <li><a href="#">Admin</a></li> 
      <li className="active">Index</li> 
      </ol> 
     </div> 
     <div className="main-content container-fluid"> 
      <div className="panel panel-flat"> 
      <div className="panel-heading"> 
       Admin 
       <button data-modal="create" className="btn btn-space btn-primary pull-right md-trigger admin">Create New</button> 
      </div> 
      <div className="panel-body"> 

      </div> 
      </div> 
     </div> 
     <div className="modal-overlay"></div> 

     </div> 
    ); 
    } 

} 

export default AdminPage;

mein Problem ist:

Ich habe Seite für Admin, und darin gibt es ein modales, ich benutze modal, um ein Formular anzuzeigen, wenn wir Seite beginnen oder die Route Adresse aus Adressleiste eingeben zB: localhost:3000/admin modal zeigt und alle jav Ascript-Funktion wie Alert, dass ich setze (siehe oben HTML-Datei) ausgelöst wird, aber wenn ich die Seite von Sidebar Link die JavaScript-Funktion ist deaktiviert oder funktioniert nicht, Beispiel

ich Zugriff / von Sidebar Link dann ich Klicken Sie auf /admin und ich klicke auf die Schaltfläche, um anzuzeigen, dass es Modal nicht anzeigt.

ich benutze react route v4 und meine Frage ist genau das gleiche wie this, aber ich möchte mehr einfache, effektive und effiziente Art und Weise.

Jeder kann helfen? Danke.

Quelle

2017-07-19 Mamen

Es tut mir leid, aber ich sehe nicht, irgendeine reagierende Komponente? –

check oben, ich habe es hinzugefügt – Mamen

haben Sie versucht zu ändern '' bis '' –

denke ich, das Problem in jQuery ist wie here nach DOM-Updates Bindung und Sie sollten diese Zeile umschreiben:

$('.admin').click(function(){//button modal

dazu:

$(document).on('','.admin',function(){//button modal

Quelle

2017-07-19 11:49:59 Melounek

das heißt, ich muss bootstrap.js bearbeiten? – Mamen

Ich meine speziell die Zeile aus der ersten Datei .. – Melounek

JavaScript-Funktion nach dem Weg zu anderer Seite deaktiviert

Antwort

Verwandte Themen