开发者

Slide dynamic jQuery

开发者 https://www.devze.com 2023-02-21 18:11 出处:网络
I have been trying to use jQuery to create an dynamic loop in an for loop. For some reason when clicking the link that page is opened in an new window instead of sliding down.

I have been trying to use jQuery to create an dynamic loop in an for loop. For some reason when clicking the link that page is opened in an new window instead of sliding down.

<script type="text/javascript">
$('a.moreDetails').click(function() {
$(this).parent().next().toggle('fast');
});
</script>

while ($row = mysq开发者_运维百科l_fetch_array($res))
{
    echo '<tr onMouseOver="addHighlight(this);" onMouseOut="removeHighlight(this);" onclick="setHighlighted(this);">
              <td colspan="11"> <a href="includes/js/ajax_details_adres.php?id='.$row['id'].'" class="moreDetails">(details)</a><div class="details" id="details'.$row['id'].'">More details</div> </td>
          </tr>';
}


If you want the contents of includes/js/ajax_details_adres.php?id='.$row['id']. to be loaded in a div on click of a link, try something like this:

<script type="text/javascript">
$(document).ready(function() {
    $('a.moreDetails').click(function() {
       var rowID = this.id;
       $(this).siblings(".details").load("includes/js/ajax_details_adres.php?id="+rowID);
       $(this).parent().next().toggle('fast');
    });
});
</script>

while ($row = mysql_fetch_array($res))
{
    echo '<tr onMouseOver="addHighlight(this);" onMouseOut="removeHighlight(this);" onclick="setHighlighted(this);">
              <td colspan="11"> <a href="#" class="moreDetails" id="'.$row['id'].'">(details)</a><div class="details" id="details'.$row['id'].'">More details</div> </td>
          </tr>';
}

What you want to be doing on click is getting the contents of the URL you have set as the target of your link and loading it into the current page, correct? So you need to use ajax to load the content into your existing page. This is done via load. The code above may not capture exactly what you want to do, but it should get you started.


$('a.moreDetails').click(function(ev) {
    $(this).parent().next().toggle('fast');
    ev.preventDefault();
});

preventDefault prevents the a from opening its href. So it only executes the javascript click handler.

0

精彩评论

暂无评论...
验证码 换一张
取 消