从控制器注入一些 javascript 或 css

Inject some javascript or css from a controller

我有一些页面正在通过调用视图以正常方式加载,就像您期望的那样,$this->load->view('foo') 但是我放置所有 javascript main.js 的文件正在提供firebug 上的错误,如果它错过了它需要的 html。

为了停止错误,我想避免在所有页面中加载 main.js,而是只加载特定页面使用的 javascript。

我试过了

public function index(){
echo <<<'EOT'
$(document).ready(function(){
$(".btn").click(function(){
$(this).hide();
});
}); 

EOT;
echo '<button class="btn btn-primary">'.$this->lang->line('lorem_ipsum').'</button>';
//$this->load->view('foo');
} 

我知道 EOT 会显示代码而不是将其注入到获取的视图中,但这就是我的想法。

有什么方法可以从控制器 index 将 javascript 或 css 注入到 foo 中吗?

您始终可以设置视图变量并在您想要加载该 JS 文件(或仅在特定页面上使用的任何其他文件)时使用。尝试这样的事情:

在你的控制器中:

$this->load->view('foo', array('loadMainJS'=>true));

那么在你看来:

<?php if (isset($loadMainJS) && $loadMainJS): ?>
    <script src="main.js"></script>
<?php endif; ?>

您甚至可以制作一个单独的视图,只加载该文件,然后仅在需要时从控制器加载该视图。实际上,有很多方法可以做到这一点。

添加到 Shomz,我能够在控制器中创建一个变量

    public function index(){

$data['custom_js'] =  <<<EOT
<script>
$(document).ready(function(){
$( '.btn' ).click(function() {
alert( 'Handler for .click() called.' );
});
});
</script>
EOT;
$this->load->view('header',$data);
echo '<button class="btn btn-primary">'.$this->lang->line('lorem_ipsum').'</button>';
$this->load->view('body');
$this->load->view('footer');
}

并在视图中使用它,

<!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">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="<?php echo base_url("assets/ico/favicon.ico"); ?>">

<title>Sticky Footer Navbar Template for Bootstrap</title>

<!-- Bootstrap core CSS -->
<link href="<?php echo base_url("assets/css/bootstrap.min.css"); ?>" rel="stylesheet">

<!-- Custom styles for this template -->
<link href="<?php echo base_url("assets/css/sticky-footer-navbar.css"); ?>" rel="stylesheet">
<link href="<?php echo base_url("assets/jui/jquery-ui.min.css"); ?>" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[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]-->
<script src="<?php echo base_url("assets/js/jquery.min.js"); ?>"></script>
<script src="<?php echo base_url("assets/jui/jquery-ui.min.js"); ?>"></script>
<script src="<?php echo base_url("assets/js/bootstrap.min.js"); ?>"></script>
<script src="<?php echo base_url("assets/js/isotopeSearchFilter.jquery.min.js"); ?>"></script>
<?php echo $custom_js; ?>
</head>
<body>