新手问题 尝试写的一段 jQuery 代码,只能在第一次打开页面的时候可以正常运行,求指教

yuanrenkai · 2016年01月15日 · 最后由 yuanrenkai 回复于 2016年01月18日 · 2209 次阅读

情况说明:服务开启后,第一次 访问页面,下面的功能可以正常运行,离开页面后,再次访问,下面的功能失效

为什么 呢?

$(document).ready(initPage);

function initPage(){
  var edit = $(".edit");
  var prev = $(".preview");
  var txtBox = $("#topic_body") ;
  var insert_code = $(".insert_code");


  edit.on("click" , edit_f);
  prev.on("click" , preview_f);
  insert_code.on("click" , insert_code_f);


  function insert_code_f(){
    var language = $(this).attr("data-lang") ;
    var caret_pos = txtBox.caret();
    var prefix_break = "" ;
    if (txtBox.val().length > 0){
      prefix_break = "\n" ;
    }
    var src_merged = prefix_break + "```" + language + "\n\n```\n" ;
    var source = txtBox.val() ;
    txtBox.val(source + src_merged) ;
  }

  function preview_f(){
    prev.addClass('active') ;
    edit.removeClass('active');
    txtBox.hide();
  }

  function edit_f(){
    edit.addClass('active') ;
    prev.removeClass('active');
    txtBox.show();
  }
}

  1. 是否使用了 turbolinks
  2. 如果使用了,请检查逻辑选择 $(document).on 'page:load', 'page:before-change','page:restore' 替代 $(document).ready

@kikyous @small_fish__ 谢谢,,果然与 turbolinks 有关,改成$(documnet).on('page:load' , initPage) 完美解决

#3 楼 @yuanrenkai 感觉你直接这样改还是有问题,详见这里https://ruby-china.org/topics/13884

@qinfanpeng 相对 page:change 和 page:load 似乎只有第一次访问这点的区别,如果我需要使用到的特效不是在首页上,两者来说的话应该没有问题。不知道你说的是不是这点??

#6 楼 @yuanrenkai 是的,貌似第一次加载是不会触发 page:load的。

#7 楼 @qinfanpeng 第一次加载不会触发 turbolinks 的事件。

@qinfanpeng 认真的测试了下哈,刚才我给你说的还是有个误区哈,,page:load 在第一次访问(存在该触发事件的元素的页面)的时候不会触发 turbolinks 事件,只有第二次访问的时候才会触发。。

需要 登录 后方可回复, 如果你还没有账号请 注册新账号