將數據庫值插入.js文件中

Question

我有一個看法，

<div class="square_box col-xs-7 text-right">
      <span>Views Today</span>

  <div class="number" id="myTargetElement1"></div>
                            </div>

所以我想將一些值從數據庫傳遞到此.js文件，例如，我想從數據庫中獲取值90

 var demo = new CountUp("myTargetElement1", 12.52, 90, 0, 6, options);
    demo.start();

請幫幫我，原因是卡在試圖找出如何在公共文件夾中找到的js文件中使用php查詢腳本的原因

Answer 1

您必須使用AJAX將數據提取到JS代碼中，然后使用它。

或者，您可以簡單地從db獲取結果並將其傳遞給視圖。

$value = DB::table('your_table')->get();
return view('some_view', [ 'value' => $value ]);

然后，只需在視圖文件中使用{{blade}}將其回顯即可

<script>
    var demo = new CountUp("myTargetElement1", 12.52, {{ $value }}, 0, 6, options);
</script>

Answer 2

最簡單的方法可能是使用ajax調用視圖並在html內顯示該視圖。

這是一個非常粗糙的例子。

$.ajax({
  url: "/path/to/your/view",
  cache: false
})
  .done(function( html ) {
    $( "#myTargetElement1" ).append( html );
  });

Answer 3

我建議使用html標記屬性存儲值，然后在您的JavaScript文件中檢索它。
HTML檔案：

<div class="square_box col-xs-7 text-right">
      <span>Views Today</span>

  <div class="number" data-value={{$value}} id="myTargetElement1"></div>
                            </div>

JS檔案：。

<script>
    var value = $('#myTargetElement1').attr('data-value');
    var demo = new CountUp("myTargetElement1", 12.52, value, 0, 6, options);
</script>