这是我的模板示例代码。
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>WebLAB</title>
<link rel="stylesheet" href="<?php echo base_url()?>assets/css/bootstrap.css" />
</head>
<body class="container">
<header class="panel-heading" role="navigation">
<a class="navbar-brand" href="<?php echo base_url(); ?>">WebLAB</a>
<nav>
<ul class="nav nav-tabs" role="tablist">
<li><a href="<?php echo base_url(); ?>portal/registration">Register</a></li>
<li><a href="<?php echo base_url(); ?>portal/about">About this site</a></li>
</ul>
</nav>
</header>
<section class="container">
<!--- Dynamic content is loaded here!-->
<?php if(isset($content)) echo $content; ?>
</section>
<footer class="panel-footer text-center">
<span><small>All Rights Reserved | © <?php echo date('Y'); ?> Christ the King College-ICT Team</small></span>
</footer>
<script type="text/javascript" src="<?php echo base_url()?>assets/js/jQuery-1.10.2.js"></script>
<script type="text/javascript" src="<?php echo base_url()?>assets/js/bootstrap.js"></script>
</body>
</html>
下面这段代码是我加载到上面代码的内容(它是动态嵌入内容)。我的问题是我尝试应用于元素的 Javascript 代码没有响应。我也试过在上面的主页上添加脚本。
<script type="text/javascript">
$(document).ready(function(){
$('#jq').click(function(){
alert("Hi");
});
});
</script>
<section class="col-md-8">
<p>
<h2 id="jq">Register Your Account here to Login!</h2>
<p>
<article>
<p>
You can only access your account when the admin
approves your request for registration.
</p>
</article>
</section>
<section class="col-md-4">
<form method="post" class="regform" action="<?php echo base_url();?>portal/register" role="form">
<div class="form-group">
<label for="Username" id="sample">Username:</label>
<input type="Username" class="form-control" id="Username" name="username" placeholder="example@mail.com" required>
</div>
<div class="form-group">
<label for="pwd">Password:</label>
<input type="password" class="form-control" id="pwd" name="password" required>
</div>
<div class="form-group">
<label for="pwd">Retype-Password:</label>
<input type="password" class="form-control" id="pwd" name="repassword" required>
</div>
<button type="submit" class="btn btn-default">Register</button>
</form>
</section>
我在 CodeIgniter 3 Controller 中使用这种技术。
public function registration() {
$data = null;
$data['content'] = $this->load->view('pages/registration', $data, true);
$this->load->view('template/temp_portal.php', $data);
}
对不起，乱七八糟的代码。非常感谢您的帮助。这只是一个示例代码顺便说一句。
最佳答案
你的问题是你在加载库之前使用了 jquery。在 head 标签中加载包含 jquery 库的 JS 文件。它会起作用，即
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>WebLAB</title>
<link rel="stylesheet" href="<?php echo base_url()?>assets/css/bootstrap.css" />
<script type="text/javascript" src="<?php echo base_url()?>assets/js/jQuery-1.10.2.js"></script>
<script type="text/javascript" src="<?php echo base_url()?>assets/js/bootstrap.js"></script>
</head>
<body class="container">
<header class="panel-heading" role="navigation">
<a class="navbar-brand" href="<?php echo base_url(); ?>">WebLAB</a>
<nav>
<ul class="nav nav-tabs" role="tablist">
<li><a href="<?php echo base_url(); ?>portal/registration">Register</a></li>
<li><a href="<?php echo base_url(); ?>portal/about">About this site</a></li>
</ul>
</nav>
</header>
<section class="container">
<!--- Dynamic content is loaded here!-->
<?php if(isset($content)) echo $content; ?>
</section>
<footer class="panel-footer text-center">
<span><small>All Rights Reserved | © <?php echo date('Y'); ?> Christ the King College-ICT Team</small></span>
</footer>
</body>
</html>
试试这个并检查你的控制台现在显示什么错误
仔细检查您的 jQuery 库链接是否正确
关于javascript - 模板上动态添加的内容不响应 CodeIgniter 中的 Javascript/AJAX/Jquery，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32033657/