Question

现在我正在使用Laravel 5.0开发电子商务购物网站，这对于我的fyp来说，还有很长的路要走..无论如何。

而且，我制作产品展示页

这是我的控制者：

     public function getView($id)
{
    return view('store.show')->with('products', Product::find($id))->with('categories',Category::all())->with('db',Product::all())->with('options', Gambar::where('product_id','=',$id)->lists('name', 'img'));
}

正如您所看到的，在该行的末尾有代码列表（＆＃39;名称＆＃39;，＆＃39; img＆＃39;）

它会将列名和图像值列入List

一切都是完美的接受，我需要制作下拉列表，选择图像更改。

查看我的下拉列表和imageswap的代码：

    <div class="form-group">

     {!! Form::open(array('url' => 'foo/bar')) !!}
     {!! Form::label('Link Category') !!}<br />
     {!! Form::select('product_id',(['0' => 'Select an Option'] + $options),null,['class' => 'form-control', 'id' => 'dlist', 'onChange' => 'swapImage()']) !!}
     {!! Form::close() !!}

     <script type="text/javascript">
     function swapImage(){
     var image = document.getElementById("imageToSwap");
     var dropd = document.getElementById("dlist");
     image.src = dropd.value;
     };
     </script>
    </div>

此代码的图像将基于select（products-＆gt;图像）显示为主图像，而非下拉列表中的种子：

 <img id="imageToSwap" src="{{asset($products->image)}}"  />

控制器中List的流程有效，但它在视图源chrome中提供了这个：

<img id="imageToSwap" src="img/upload/20-3-291-image-1.jpg"  />

因此图片不会出现在页面中，它应该如下所示：

<img id="imageToSwap" src="localhost:8000/img/upload/20-3-291-image-1.jpg"  />

问题是，如何返回＆＃34; img＆＃34;使用laravel asset {{asset（）}}，这样图像可以完美显示？

Answer 1

问题在于laravel和javascript之间的沟通。

如您所述，您使用列表（'name'，'img'）：不会在那里添加资产前缀。

因此，当您执行image.src = dropd.value;时，图片的来源没有资产前缀。

我看到了两种可能性：

要么在发送之前对列表进行一些处理： lists('name', 'img')->map(asset)（使用map方法 - 不确定它是否可用于laravel 5.0）
或者您在javascript中添加它：image.src = "{{asset()}}/" + dropd.value;

Laravel Javascript图像交换下拉列表

1 个答案: