Question

我正在尝试修改使用node，express，ejs和jquery创建的Web应用程序的现有代码。我正在研究一个展示产品清单的部分。每个产品都可以编辑。当您单击编辑按钮时，您将获得一个模式，如果是产品，则填写当前信息。我遇到的问题是与产品相关的图片。当前代码不会拉出当前图像，因此您必须再次输入。我必须修改代码才能拉出当前图片。但为此，我需要能够在ejs模板和jquery之间进行通信，反之亦然。但我暂时还没有。

这是ejs代码的相关部分

<div class="container panel wide-event-panel" id="table-content" >
                <% for(var i=0; i< product.length; i++) {%>
                    <div class="row">
                        <div class="col-md-5 no-padding">
                            <img src="<%= product[i].banner %>" alt="Promo image" class="imgIzq"/>
                            <p class="text-next-2-img"> <%= product[i].name %></p>
                        </div>

... ＆lt;％= product [i] ._ id ['$ oid']％＆gt; ＆lt;％= i％＆gt; Editar ＆lt;％}％＆gt;

和同一个ejs模板中的模态

<div id="prod-custom-template" class="carousel slide" data-interval="false">

... ＆lt;％for（var i = 0; i＆lt; image.length; i ++）{％＆gt; “alt =”...“＆gt; “＆gt; ＆lt;％}％＆gt;

这是填充产品信息的jquery functino。

fillProductData = function(data, productButton){
    document.getElementById('prod-input-name').value=data.name;
    var type = data.product_type === "product" ? "Producto" : "Servicio";
    document.getElementById('selectedType').value=data.product_type;
    document.getElementById('typeSpan').innerHTML=type;
    document.getElementById('prod-price').value=data.price;
    document.getElementById('prod-category').value=data.category;
    $('#descriptionTextarea').val(data.description);        
   if(data.keywords){
       document.getElementById('prod-keyword').value ='';
        for(i = 0; i<data.keywords.length; i++){
            document.getElementById('prod-keyword').value += data.keywords[i] +",";
        }          
   }
    document.getElementById('prod-modal-header').innerHTML="Editar Producto/Servicio";
    $('#acceptEditProduct').removeClass("hidden");
    $('#acceptNewProduct').addClass("hidden");
    var images= $('div.item').find('img');
    $('.active').removeClass('active');
    console.log(images);
    for(i=0;i<images.length;i++){ 
        var checkingImage = images[i];                        
        if(checkingImage.src === data.banner){
            var $this = $(checkingImage)[0].parentElement;                      
            $($this).addClass('active');
            var $indicator= $('.indicator')[i];
            $($indicator).addClass('active');
        }
    }
    if($('.active').length === 0){
        var $firstImage = $('div.item')[0];
        $($firstImage).addClass('active');
        var $firstIndicator= $('.indicator')[0];
        $($firstIndicator).addClass('active');
    }
};

这是两个单独的文件，第三个文件带有快递应用程序，可将图像发送到ejs模板。我已经尝试了很多东西，但我应该做的是将图像列表发送到jquery函数，以便我可以添加列表的第一个对象当前图片。任何有关如何进行此类沟通的帮助都将非常感激。

ejs模板和jquery之间的通信

0 个答案: