Question

我刚注意到jquery事件发生后我的链接无法正常工作...... 我想做的是使div更大并交换内容。事件发生后，Rails link_to并呈现＆＃39;形式＆＃39;停止工作... 我该如何解决这个问题，如果你知道为什么会这样，你能解释一下原因吗？

JQuery代码

jQuery(document).ready(function(){
jQuery(".readmore").on('click',function(event){
    event.preventDefault();
    var $id = $(this).attr("id");
    var $target_id = "#post-"+$id; 
    var $long = ".long-"+$id;
    var $short = ".short-"+$id;
    jQuery(".flex-cube").toggle(
        function () {
            jQuery($target_id).animate({marginRight: 0,width:"490px" }, 1000, "easeInOutQuad")
        },
        function () {                
            jQuery($target_id).animate({marginRight: 0,width:"490px" }, 1000, "easeInOutQuad")                   
        }  
    );    
    jQuery($target_id).addClass(".extended");
    jQuery($long).fadeIn(1000);
    jQuery($short).fadeOut(1000);
    return;
});

}）;

HTML＆amp; RoR代码

<div class="flex-cube rounded-corner white-bk">
    <div id="form"><%= render 'form' %></div>
</div>
<% @microposts.each do |post|%>
    <div id="post-<%= post.id%>" class="flex-cube rounded-corner white-bk">
        <h5 class="black_bk white_font tenpx-padding"><%= post.username %></h5>
        <spam>
            <%= image_tag(post.image_url(:thumb)) if post.image?%>
            <% if post.posts.length > 250 %>
                <div class="short-<%=post.id%> active"><%= post.posts.slice(0..250)%>
                    <div id="<%= post.id%>" class="readmore button small post-<%= post.id%>">[-- Read More --]</div>
                </div>
                <div class="long-<%=post.id%> inactive">
                    <%= post.posts%>
                </div>

            <% else %>
                <div class="short-<%=post.id%> active"><%= post.posts%></div>
            <%end%>
        </spam>

Answer 1

event.preventDefault();

该行可防止发生默认操作。请参阅此问题以获得一个很好的解释：event.preventDefault() vs. return false。

JQuery事件杀死了rails的链接

1 个答案: