如何让showdown.js使用数据库codeigniter中的文本

时间:2016-11-24 03:36:01

标签: jquery codeigniter showdown

我正在使用showdown.js和codeigniter。一旦我将代码插入数据库,我就可以从我的数据库中预览问题了。

当我尝试查看它时。

它显示了萤火虫中的错误

  

语法错误未终止的字符串文字

Javascript Showdown

<script type="text/javascript">
var converter = new showdown.Converter(),
    text = '<?php echo $output;?>',
    target = document.getElementById('output'),
    html = converter.makeHtml(text);
    target.innerHTML = html;

</script>
  

问题:如何使showdown.js在codeigniter中使用数据库中的文本

控制器

<?php

class Example extends CI_Controller {

    public function index()
    {
        $question = $this->results();


        $data['output'] = $question['question'];  

        print_r($question['question']); 


        $this->load->view('example_view', $data);
    }

    public function results() {
        $this->db->where('question_id', '1');
        $query = $this->db->get('question');

        return $query->row_array();
    }
}

HTML

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/bootstrap3/css/bootstrap.css');?>">

    <script type="text/javascript" src="<?php echo base_url('assets/jQuery/jquery-3.1.1.js');?>"></script>
    <script type="text/javascript" src="<?php echo base_url('assets/bootstrap3/js/bootstrap.js');?>"></script>
    <script type="text/javascript" src="<?php echo base_url('assets/showdown/dist/showdown.js');?>"></script>
</head>
<body>

<div class="container">

<div class="row">
<div class="col-lg-12">
<textarea rows="10" class="form-control" id="editor"></textarea>
</div>
</div>

<div class="row">
<div class="col-lg-12">
<div id="preview"></div>
</div>
</div>

<div class="row">
<div class="col-lg-12">
<div id="output"></div>
</div>
</div>

</div>


<script type="text/javascript">
$("#editor").on('keyup', function(e) {
var text = document.getElementById('editor').value,
      target = document.getElementById('preview'),
      converter = new showdown.Converter(),
      html = converter.makeHtml(text);

    target.innerHTML = html;
});
</script>

<script type="text/javascript">
var converter = new showdown.Converter(),
    text = '<?php echo $output;?>',
    target = document.getElementById('output'),
    html = converter.makeHtml(text);
    target.innerHTML = html;

</script>

</body>
</html>

enter image description here

enter image description here

1 个答案:

答案 0 :(得分:1)

在没有使用数据库并只传入各种类型的测试字符串的修修补补中,您会注意到......

$preview = '###Test String\r\n## I am a Rabbit';

像处理一样工作,而像(你从数据库中产生的)字符串

 $preview = '###Test String
    ## I am a Rabbit';

导致错误! 经过一点点狩猎后,我发现了这个巧妙的伎俩。

要格式化在Javascript中使用的字符串,您可以使用json_encode()

你必须按摩它以适应你的情况......

$text = json_encode($text); // The string from your Table
echo "<script>var text={$text};</script>"; // Set it up as a var to pass to your JS

或者在JS本身内,你可以使用类似的东西,或者你想要传递的东西 它在....

echo
"<script>
 $(document).ready(function(){
    var text={$preview};
    var converter = new showdown.Converter(),
    target = document.getElementById(\'output\'),
    html = converter.makeHtml(text);
    target.innerHTML = html;
});
</script>";

$(document).ready()包装器按预期工作。