阿贾克斯返回数据后更改div的高度与jquery

问题描述：

我有一个div，它总是与它旁边的div相同的高度（取决于有多少内容加载在该div等）。阿贾克斯返回数据后更改div的高度与jquery

这工作正常，但现在我添加了一个使用jQuery的搜索功能，它停止工作。当我搜索时，jquery计算中使用的元素再次被加载。所以我尝试在ajax回调中添加jQuery代码，但这也不起作用。我该怎么办？

我的代码：

$(window).resize(function() { 
    var contenthoogte = $(".news-content").height(); 
    $(".contenthoogteaangepast").css("height", contenthoogte); 
}).resize();

我的HTML：

<div class="col-sm-4 padding-zero contenthoogteaangepast"> 
     <form action="ajax/result.php" id="zoeken"> 
      <div class="zoekveld"> 
       <input class="inputzoek" type="text" placeholder="zoeken..." name="zoekwaarde"> 
       <input class="inputbutton" type="submit" value="Zoeken"> 
      </div> 
     </form> 
     <div class="downloads"> 
      <h4>Downloads</h4> 
       <ul> 
        <li> 
         <a href="#">- PDF Voorbeeld 1</a> 
        </li> 
        <li> 
         <a href="#">- PDF Voorbeeld 2</a> 
        </li> 
        <li> 
         <a href="#">- PDF Voorbeeld 3</a> 
        </li> 
       </ul> 
     </div> 
    </div> 
    <div class="col-sm-8 padding-zero" id="result"> 
     <div class="box large-width-box-w1 full-width-box news-right entry-content news-content"> 
       <? 
       if($zoekwaarde != ''){ 
        $zoekresultcon = $conn->query($zoekresult); 
        while($zoekresult = $zoekresultcon->fetch_assoc()){ 
         $zoekresultaten .= '<div class="zoekresultaat"><h4>'.$zoekresult['title'].'</h4></div>'; 
        } 
        echo $zoekresultaten; 
       }else{ 
        ?> 
        <h2 class="port-tit contenttitle"><? echo $content['title']; ?></h2> 
        <? 

        //Replace img met img src="cms/ zodat je ook tussen de tekst images kan toevoegen 
        $replaced = str_replace('img src="','img src="cms/',$content['introtext']); 
        echo $replaced; 
       } 
       ?> 

     </div> 
    </div>

这是我尝试使用Ajax：

应该改变，即使没有调整画面让我也尝试复制.resize函数外的代码，但这也没有改变任何东西。

在设置'＃result'内容之前，您正在触发调整大小事件。无论如何，你不应该筑巢事件 –

答

第一件事第一件事。编程时你不应该混用语言。即使是像我这样的土生土长的杜奇，这也是令人困惑的。我已将所有荷兰语单词替换为英语等同物。

就像A.沃尔夫说混合事件是不好的。所以让我们重组一些东西。

首先，我已经删除了窗口大小调整并将其替换为resizeContainer。此函数处理您的容器的大小调整。该函数也在窗口大小调整事件中调用。

function resizeContainer() { 
    var contentheight = $(".news-content").height(); 
    $(".contentheightaltered").css("height", contentheight); 
} 

$(window).resize(function() { 
    resizeContainer() 
}).resize(); 

$("#search").submit(function(event) { 
    // Stop form from submitting normally 
    event.preventDefault(); 
    // Get some values from elements on the page: 
    var $form = $(this), 
    searchvalue = $form.find('input[name="searchval"]').val(), 
    url = $form.attr("action"); 
    // Send the data using post 
    var posting = $.post(url, { searchval: searchvalue }); 
    // Put the results in a div 
    posting.done(function(data) { 
    $("#result").html(data); 
    // Resize the compagnion container AFTER the data has been updated 
    resizeContainer(); 
    }); 
});

此方法意味着您不重复代码，而是将其捆绑到一个多次调用的函数中。

答

这一个曾与我：

$("#contenthoogteaangepast").on("changeHeight", function() { 
    $(this).height($("#.news-content").height()); 
}); 

//inside the callback of the request : 
$("#contenthoogteaangepast").trigger("changeHeight");

或尝试：

function func() { 
    $(this).height($("#.news-content").height()); 
} 

//inside the callback of the request : 
func();

我没有尝试第二个，但它应该工作。

阿贾克斯返回数据后更改div的高度与jquery

相关推荐