标签: siblings

当兄弟元素重叠时有效检测

例:

<div id="big">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<div class="small">&nbsp;</div>
<!-- ...and so on -->
Run Code Online (Sandbox Code Playgroud)

"#big"绝对位于".small"的一部分后面,但不是父元素.

我一直这样做:

           var smallArray = [];

           var $big = $('#big');
           var $bigPos = $big.offset();

           $('div.small').each(function() {
                    var $this = $(this);
                    var $thisPos = $this.offset();

                    if(
                            $thisPos.left >= $bigPos.left &&
                            $thisPos.left <= $bigPos.left+$big.outerWidth() &&
                            $thisPos.top >= $bigPos.top &&
                            $thisPos.top <= $bigPos.top+$big.outerHeight()
                    ) smallArray.push($this);
            });
Run Code Online (Sandbox Code Playgroud)

......但这似乎很糟糕.我是否错过了一些jQuery或vanilla JavaScript的方法,这些方法可以让我以更优雅高效的方式做到这一点?

非常感谢您提供的任何帮助.

jquery siblings

7
推荐指数
1
解决办法
8957
查看次数

如何在父元素和父元素的兄弟元素之上显示子元素?

我的问题与这个问题有关:

使用CSS在父元素上显示子元素

设定的问题的答案overflow: visible仅适用于一个孩子的一个父母.但是,我有这些元素的行; 父母的行,我需要孩子在父母身上显示.我可以让孩子显示原来的父母,但我不能让孩子显示父母的兄弟姐妹.为了让您了解我在说什么,这是一个截图:

截图

我想要的是选项弹出窗口,隐藏在接下来的两行后面的元素,显示在这两行上,就像它显示在它的直接父级上一样.我一直在搞乱它,并没有想出来,所以希望这里的人能够提供帮助.

这是基本结构:

.row,
.selector {
  position: relative;
}

.label,
.selector {
  display: inline-block;
}

.selector {
  overflow: visible;
}

.selector-inner {
  display: block;
}

.selector-arrow {
  float: right;
  width: 21px;
  height: 21px;
  background: url(arrow.png) no-repeat center center;
}

.selector-caption {
  display: inline-block;
}

.options-popup {
  position: absolute;
  z-index: 100;
  top: 0px;
  right: 0px;
}

.options-item {
  /* only for fonts and sizes */
}
Run Code Online (Sandbox Code Playgroud)
<div class="row">
  <div class="label">Color Scheme:</div>
  <div class="selector">
    <div class="selector-inner"> …
Run Code Online (Sandbox Code Playgroud)

html css parent-child siblings

7
推荐指数
1
解决办法
8673
查看次数

什么是dynamic_cast兄弟姐妹的用例?

我现在正在阅读Scott Meyers的"更有效的C++".启发性!第2项提到dynamic_cast不仅可以用于downcast,也可以用于兄弟演员.可以请任何人为兄弟姐妹提供一个(合理的)非人为的例子吗?这个愚蠢的测试打印0应该是,但我无法想象任何这种转换的应用程序.

#include <iostream>
using namespace std;

class B {
public:
    virtual ~B() {}
};

class D1 : public B {};

class D2 : public B {};

int main() {
    B* pb = new D1;
    D2* pd2 = dynamic_cast<D2*>(pb);
    cout << pd2 << endl;
}
Run Code Online (Sandbox Code Playgroud)

c++ inheritance dynamic-cast siblings

7
推荐指数
1
解决办法
529
查看次数

上一个兄弟元素和上一个元素兄弟元素之间的区别

我想知道我是否知道javascript previoussiblingpreviouselementsibling有什么区别。我尝试过,但没有发现任何可比较或描述此问题的问题或文章。也许这是出于我对JavaScript的一点了解,但如果能对其加以解释,我将不胜感激。

非常感谢。

javascript dom compare element siblings

7
推荐指数
1
解决办法
3186
查看次数

如何使用jQuery循环兄弟姐妹?

我有以下代码:

HTML:

<div class="container">
    <div class="selected">A</div>
    <div>B</div>
    <div>C</div>
    <div>D</div>
</div>
<button id="next">next!</button>
Run Code Online (Sandbox Code Playgroud)

jQuery的:

$("#next").click(function() {
    $(".selected").removeClass("selected").next().addClass("selected");
});
Run Code Online (Sandbox Code Playgroud)

我想要的是循环容器中的div.我可以这样做循环:

$("#next").click(function() {
    if ($(".selected").next().length == 0) {
        $(".selected").removeClass("selected").siblings(":nth-child(1)").addClass("selected");
    }
    else {
        $(".selected").removeClass("selected").next().addClass("selected");
    }
});
Run Code Online (Sandbox Code Playgroud)

但我认为有一种更简单的方法.我怎样才能让它变得更简单?(我不介意你不使用这个next()功能).

jsFiddle:http://jsfiddle.net/S28uC/

javascript jquery siblings next

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

Jquery Next/NextAll/NextUntil具有计数限制

真的很烦我,我不知道答案,我觉得这很简单.我想将选定元素中的下一个和前一个元素设置为限制(例如2).这是一个例子:

<ul>
<li>link 1</li>
<li>link 2</li>
<li>link 3</li>
<li>link 4</li>
<li class='active'>link 1</li>
<li>link 6</li>
<li>link 7</li>
<li>link 8</li>
<li>link 9</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

所以我想先选择两个元素,然后选择活动后的2个元素li.我尝试过做类似的事情: $('li.active').nextAll(':eq(2)');然后将它添加到同一个使用prevAll但是它选择一个元素2个兄弟姐妹而不是整个组.

必须有一个简单的方法,我错过了任何建议?

NB我无法编辑HTML,它是动态生成的.

jquery siblings

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

PowerShell从具有多个属性的XML获取属性值

以下XML文件是从带有PowerShell 2的2008 R2故障转移群集运行的命令Get-ClusterGroup的输出的一个Object节点:

<?xml version="1.0"?>
<Objects>
  <Object>
    <Property Name="Cluster">Cluster1</Property>
    <Property Name="IsCoreGroup">False</Property>
    <Property Name="OwnerNode">Node1</Property>
    <Property Name="State">Offline</Property>
    <Property Name="Name">SAP PL1</Property>
    <Property Name="Description" />
    <Property Name="PersistentState">1</Property>
    <Property Name="FailoverThreshold">4294967295</Property>
    <Property Name="FailoverPeriod">6</Property>
    <Property Name="AutoFailbackType">1</Property>
    <Property Name="FailbackWindowStart">4294967295</Property>
    <Property Name="FailbackWindowEnd">4294967295</Property>
    <Property Name="Priority">1</Property>
    <Property Name="DefaultOwner">4294967295</Property>
    <Property Name="AntiAffinityClassNames" />
    <Property Name="Id">a5ff557f-c81a-43aa-bdb9-e09d0a1103df</Property>
  </Object>
</Objects>
Run Code Online (Sandbox Code Playgroud)

完整文件还有三个与此类似的Object节点.其中两个节点在"IsCoreGroup"属性中的值为"False",另外两个节点为"True".我想要做的是从"IsCoreGroup"属性中具有值"False"的Object节点获取"Name"属性的值和其他属性.

我已经尝试了很多方法来获取此属性,但无法弄清楚如何深入研究兄弟属性.

这是我到目前为止所拥有的:

[xml]$file = get-content C:\Admin\ClusterGroups.xml
$xmlProperties = $file.SelectNodes("/Objects/Object/Property")
Foreach ($xmlProperty in $xmlProperties) {
    $strName = ($xmlProperty | Where-Object {$_.Name -eq "IsCoreGroup" }).InnerXml
    If ($strName -eq "False")
    {
    Echo $xmlProperty
    }
}
Run Code Online (Sandbox Code Playgroud)

这给了我以下内容:

Name                                      #text …
Run Code Online (Sandbox Code Playgroud)

xml powershell siblings

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

相当于JQuery .next()的JavaScript

有没有类似于jQuery .next()的JavaScript方法?我想找到下一个相对于该元素具有“错误”类的元素。我试过使用.nextSibling作为循环,但无法弄清楚。不知道是否有没有jQuery的简便方法。

例如,如果我有以下代码:

<div id="section">
    <div id="test">test</div>
    <span class="info">Information</span>
    <span class="error">Error!</span>
</div>
Run Code Online (Sandbox Code Playgroud)

我正在尝试使下一个.error类最接近#test,如果我有一个#section2和a,#test2我想使.error该类最接近#test2,依此类推。

javascript siblings next

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

SQL Server等效于Oracle的"CONNECT BY PRIOR"和"ORDER SIBLINGS BY"

我有这个Oracle代码结构,我正在尝试转换为SQL Server 2008 (注意:我在方括号'[]'中使用了通用名称,封闭的列名和表名,并做了一些格式化以使代码更多可读):

SELECT [col#1], [col#2], [col#3], ..., [col#n], [LEVEL] 
FROM (SELECT [col#1], [col#2], [col#3], ..., [col#n] 
      FROM [TABLE_1] 
      WHERE ... ) 
CONNECT BY PRIOR [col#1] = [col#2] 
START WITH [col#2] IS NULL 
ORDER SIBLINGS BY [col#3]
Run Code Online (Sandbox Code Playgroud)

什么是上述代码的SQL Server等效模板

具体来说,我正在努力与LEVEL和'ORDER SIBLINGS BY'Oracle构造.

注意: 上面的"代码"是一组Oracle过程的最终输出.基本上,'WHERE'子句是动态构建的,并根据传递的各种参数而变化.以"CONNECT BY PRIOR"开头代码块是硬编码的.


以供参考:

SQL SERVER文章中关于ORACLE的连接模拟很接近,但它没有解释如何处理'LEVEL'和'ORDER SIBLINGS'结构.......我的思绪在变化!

SELECT name 
  FROM emp
  START WITH name = …
Run Code Online (Sandbox Code Playgroud)

sql-server oracle connect-by recursive-query siblings

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

如何实现搜索栏按钮和结果组件的反应

我已经看到了其他相似的答案,但由于我是初学者,我尝试实现它们,我很困惑,没有什么对我有用.这是问题所在:

我有一个搜索栏(搜索栏组件),它应该有一个提交按钮.单击该按钮时,搜索结果应显示在Viewer组件中.我不知道如何从Viewer中的Searchbar连接事件.如何告诉一个组件另一个组件发生了什么变化?我想要两个兄弟姐妹来沟通

import React from 'react';

var Searchbar = React.createClass({
  getInitialState: function () {
    return {};
  },

handleSubmit: function (e) {
e.preventDefault();
// what to do here
},
render: function () {
return (
  <form onSubmit={this.handleSubmit}>
    <h3>I'm looking for:</h3>
    <input ref="srch" type="search" id="search" placeholder="Search..." />
    <button>Go</button>
    <hr />
  </
});

export default Searchbar;
Run Code Online (Sandbox Code Playgroud)

现在为结果组件:

var Result = React.createClass({

render() {
    return (
        <div>
            <hr />
            <h2>Result here</h2>
            <h2>{this.props.result.drug_name}</h2>        
            <span>{this.props.result.description}</span>
            <img src={this.props.result.image} />
        </div>
    )
}
export default Result;
Run Code Online (Sandbox Code Playgroud)

它们都包含在src文件夹中,并在App.js中呈现为

    var …
Run Code Online (Sandbox Code Playgroud)

javascript binding siblings reactjs

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