小编Bla*_*ger的帖子

jQuery获取下一个元素及其所有子元素

我怎样才能得到下一个div元素然后是它的所有子元素?

<div class="1"></div>
<div class="2">
    <div class="child1"></div>
    <div class="child2"></div>
</div>
<div class="3">
    <div class="child1"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

所以,如果$(this)目前是1级,我怎么才能到达2级及其所有孩子.我不能通过它的类名来引用它,因为我不知道那是什么.

我基本上希望将这两个语句合并为1.

$(this).next('div').animate({height : 'toggle'});
$(this).next('div *').animate({height : 'toggle'});
Run Code Online (Sandbox Code Playgroud)

jquery

6
推荐指数
1
解决办法
6430
查看次数

slideDown最后突然跳了起来

我在垂直列中构建了一个相当普通的菜单子菜单 - 嵌套的UL,slideToggle用于展开和折叠子菜单.

我试图解决的问题是子菜单在最后"跳"开的方式.(我正在测试最新版本的Chrome.)在第二个子菜单"好处"中,这可能是最值得注意的.当菜单折叠时,它不会跳转,只有当它们正在扩展时才会跳转.

我认为问题可能与:after仅在菜单完全展开时添加的样式有关.具体来说,current一旦菜单完全展开,该类就会添加到LI标签中.但是注释掉切换该类的代码似乎没有任何效果.

http://jsfiddle.net/mblase75/5gGum/

JS:

$(document).ready(function() {
    $('#group-subnav > ul > li > a').on('click', function(e) {
        e.preventDefault();
        var $li = $(this).closest('li');
        $li.find('ul').slideToggle('', function() {
            $li.toggleClass('current')
        }).end().siblings().find('ul').slideUp('', function() {
            $li.siblings().removeClass('current')
        }).end();
    });
});?
Run Code Online (Sandbox Code Playgroud)

CSS相当可观,HTML也不起眼.

javascript css jquery html5

6
推荐指数
4
解决办法
1万
查看次数

使用jQuery/.data()避免内存泄漏

我正在使用jQuery动态创建HTML元素,现在需要存储针对它们的JavaScript数据.但是,我现在担心内存泄漏,因为我从来没有在我的对象上实际调用'remove'.我'.''''''''''''''''''''''''''''''''''''''''''' jQuery的文档似乎暗示我应该调用remove来清理它在对象上的足迹 - 事件,数据等.

这在现代浏览器中是否是必要的,或者对元素的任何引用的消失是否会为我做这个?

另一种表达我问题的方法; 这个脚本片段是否会泄漏内存?

function createElement()
{    
    var newDiv = $("<div>")
       .data("test", "test data")
       .appendTo(document.body)
       .detach();

    setTimeout(createElement, 10);
}

createElement();
Run Code Online (Sandbox Code Playgroud)

就此而言,即使没有 .data()调用,这是否会泄漏内存?

我对支持非常旧的浏览器不感兴趣.IE9和更好,基本上.

javascript jquery dom

6
推荐指数
1
解决办法
2152
查看次数

target = _blank不适用于GA出站链接跟踪

我想跟踪出站链接的点击次数并实现以下代码:

GA代码

var trackOutboundLink = function(url) {
   ga('send', 'event', 'outbound', 'click', url, {'hitCallback':
     function () {
     document.location = url;
     }
   });
}
Run Code Online (Sandbox Code Playgroud)

链接

<a class="postLinks" href="<?php if (get_field('source_link')) echo get_field('source_link'); ?>" onclick="trackOutboundLink('<?php if (get_field("source_link")) echo get_field("source_link"); ?>'); return false;"><?php the_title(); ?></a>
Run Code Online (Sandbox Code Playgroud)

TARGET = _blank

我target=_blank通过jQuery 添加属性,基于网站的访问者是否勾选复选框(然后将选择存储在cookie中).但是,如果我选择在新窗口中打开出站链接,则它不起作用.勾选复选框时,它会正确地将目标属性添加到链接中,但是当我单击链接时,它会在同一窗口中打开它.

与目标属性的链接

<a class="postLinks" href="<?php if (get_field('source_link')) echo get_field('source_link'); ?>" onclick="trackOutboundLink('<?php if (get_field("source_link")) echo get_field("source_link"); ?>'); return false;" target="_blank"><?php the_title(); ?></a>
Run Code Online (Sandbox Code Playgroud)

任何的想法?

javascript jquery google-analytics outbound event-tracking

6
推荐指数
2
解决办法
9809
查看次数

Materialize css选择不使用JS错误

我使用Materialize css框架选择表单时遇到问题.这是我的表格:

<div class="input-field col s12">
    <select multiple>
        <option value="" disabled selected>Choose your option</option>
        <option value="1">Option 1</option>
        <option value="2">Option 2</option>
        <option value="3">Option 3</option>
    </select>
    <label>Materialize Multiple Select</label>
</div>

<script src="//code.jquery.com/jquery-2.1.2.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/js/materialize.min.js"></script>

<script>
    $('select').material_select();
</script>
Run Code Online (Sandbox Code Playgroud)

这是我的苗条布局:

doctype html
html
  head
    meta content=("text/html; charset=UTF-8") http-equiv="Content-Type" /
    title Budeprace
    = stylesheet_link_tag    'https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/css/materialize.min.css', media: 'screen,projection'
    = stylesheet_link_tag    'http://fonts.googleapis.com/icon?family=Material+Icons'
    = stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true
    = javascript_include_tag 'application', 'data-turbolinks-track' => true
    = csrf_meta_tags
    meta content="width=device-width, initial-scale=1.0" name="viewport"

  body
    .container
      - flash.each do …
Run Code Online (Sandbox Code Playgroud)

javascript jquery ruby-on-rails

6
推荐指数
1
解决办法
1万
查看次数

如何在css中同时获取图标和标题

我希望图标和标题在同一行中,如下所示:

在此输入图像描述

但我仍然是这样的:

在此输入图像描述

代码:

.icon-small i{
  height: 38px;  
  width: 38px; 
  color: #fff;
  background-color: #888;
  border-radius: 10%;
  text-align: center;
  vertical-align: middle;
  padding-top: 12px;

}
.icon-small + p{
  margin-top: 15px;

}
.icon-small h4,
.icon-small h5{
  text-align: left;
}
Run Code Online (Sandbox Code Playgroud)
<div class="row">
  <div class="col span-1-of-3">
    <span class="icon-small">
      <i class="fa fa-television"></i>
      <h4>Web applications</h4>
      <h5>Mobile & Tablets Ready</h5>
    </span>
    <p>Powerful, fast and robust web applications to cater for complex business needs.</p>
  </div>
  <div class="col span-1-of-3">
    <span class="icon-small">
      <i class="fa fa-mobile-phone"></i>
      <h4>Mobile apps</h4>
      <h5>For the iPhone, iPad & …
Run Code Online (Sandbox Code Playgroud)

html css

6
推荐指数
1
解决办法
1万
查看次数

如何选择多个元素的兄弟姐妹()?

说我有一个隐藏<dl>所有的东西<dd>.单击使用以下代码<dt>切换<dd>后面的s:

$(this).nextUntil('dt').toggle();
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/mblase75/FZQj7/

现在,我想自动隐藏<dd>其他s之后的<dt>s,所以我尝试用这段代码抓住兄弟姐妹:

$(this).nextUntil('dt').toggle()
    .siblings().filter('dd').hide();
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/mblase75/FZQj7/1/

但是没有任何事情发生,因为<dd>我已经选择的.nextUntil每一个都是彼此的兄弟姐妹.结果,它们都被隐藏起来,没有任何东西被展示出来.

必须有一种紧凑的方式告诉jQuery选择所有兄弟姐妹,除了我已经选择的那些,但我看不到它.想法?

javascript jquery

5
推荐指数
1
解决办法
1223
查看次数

查看重定向的文件源

当我点击URL时,正在使用重定向 window.location

我正在尝试查看此html文件背后的代码,但由于它是重定向的,我无法查看它.如何查看重定向文件的源代码?我可以强制浏览器不执行javascript代码而是查看它吗?

javascript jquery google-chrome

5
推荐指数
2
解决办法
4665
查看次数

谷歌分析中的浏览器窗口大小?

我们正尝试在Google Analytics中捕获实际浏览器窗口大小的报告.我知道他们已经进行了页内分析,但这并不提供数据,只提供可视化.任何人都知道我们是否遗漏了什么,或者我们是否需要将其添加为自定义事件?

这真的有必要吗?

<script type="text/javascript">
 var width  = window.innerWidth  || document.body.clientWidth;
 var height = window.innerHeight || document.body.clientHeight;

 width  = Math.round(width/100)*100;
 height = Math.round(height/100)*100;

 var size = width + "x" + height;
 _gaq.push(['_trackEvent', 'Browser Size', 'Range', size]);
</script>
Run Code Online (Sandbox Code Playgroud)

google-analytics

5
推荐指数
2
解决办法
5648
查看次数

随机orderBy在AngularJS 1.2中返回'infdig'错误

orderBy在这个问题中使用随机排序技术在AngularJS 1.1中运行良好.

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.list = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
    $scope.random = function() {
        return 0.5 - Math.random();
    }
}
Run Code Online (Sandbox Code Playgroud)

但是在1.2中,它会将infdig错误放入控制台并花费更长的时间来返回排序结果:http: //jsfiddle.net/mblase75/jVs27/

控制台中的错误如下所示:

Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: [["fn: $watchCollectionWatch; newVal: 42; oldVal: 36"],["fn: $watchCollectionWatch; newVal: 47; oldVal: 42"],["fn: $watchCollectionWatch; newVal: 54; oldVal: 47"],["fn: $watchCollectionWatch; newVal: 61; oldVal: 54"],["fn: $watchCollectionWatch; newVal: 68; oldVal: 61"]]
Run Code Online (Sandbox Code Playgroud)

该文档orderBy …

javascript angularjs angularjs-orderby

5
推荐指数
1
解决办法
3641
查看次数