我需要的

  • 我需要从events_links类访问href。

HTML代码

    <div class="row flush frt" itemscope="" itemtype="http://schema.org/Event">
   <div class="12u">
  <div class="evntblk">
     <a itemprop="url" class="events_links" href="/dailymail-ideal-homeshow">
        <h2 class="lnh1" itemprop="name">Ideal Home Show - London</h2>
     </a>
     <div style="display:block; float:right; width:auto; color:#7c7c7c;"><a href="javascript:void(0);" class="favourate" title="Add to Favorites" id="fav8470" data-sess_id="8470" data-name="Ideal Home Show - London" data-city="London" data-country="United Kingdom" data-event_url="dailymail-ideal-homeshow"></a></div>
     <span itemprop="startDate" class="startdates" content="2015-03-20">20 Mar-06 Apr 2015</span><span itemprop="endDate" class="enddates" content="2015-04-06"></span><br><span itemprop="location" itemscope="" itemtype="http://schema.org/Place"><span itemprop="name" style="display:none">Olympia Exhibition Centre</span><span itemprop="address" itemscope="" itemtype="http://schema.org/PostalAddress"><span itemprop="addressLocality" class="eventcity">London</span>,
     <span itemprop="addressCountry" class="eventcountry">UK</span></span></span>
     <p class="tal" style="overflow:hidden">The ZEE Asian Pavilions are a celebration of British Asian Culture, that encapsulates Asian food, Asian fashion,...<br><span style="background: none repeat scroll 0 0 #ECECEC; border-radius: 5px; color: #333333; display: inline-block; font-size: 0.8em;line-height: 13px; margin: 5px 2px 0 0 !important; padding: 5px 8px;">Home Furnishings &amp; Home Textiles</span></p>
  </div>

    <div class="row flush footer"><div class="12u"><a class="button button-blue small">View Details</a></div></div>

js代码

$('.small').click(function()
{
    alert("test");
    window.location.href = $(this).find(".events_links").attr("href");
});

html元素的快照

在此处输入图片说明

  • 我试图用.parent()访问,但它不起作用。

O / P

  • 我需要通过单击小类来访问events_links类,以便从该html元素获取href。

  • 任何建议都是最欢迎的。

===============>>#1 票数:3 已采纳

仅获取相关URL的简单解决方案是使用parent()函数:

$('.small').click(function()
{
    window.location.href = $(this).parent().parent().parent().find(".events_links").attr("href");
});

因为您位于下面的三个级别。

find()将开始从给定对象的层次结构向下搜索。

但是如前所述,一旦更改html布局并可能删除或添加div容器,此操作将失败。

最好给您的div包含网址唯一ID或将链接存储为按钮的data属性。

例如,如果在您的HTML代码中

<div id="link12" class="event_links" href="FOUND THIS!">
    <div class="whatever">
        <div class="anotherone">
            <div class="button small" data-link="link12" data-href="FOUND THIS HERE TOO!">
                CLICK HERE
            </div>
        </div>
    </div>
</div>

然后,您的点击代码可以通过2种方法访问URL:

$('.small').click(function()
{
  // METHOD 1: get by storing unique id with button
  alert($('#'+$(this).attr('data-link')).attr("href"));  

  // METHOD 2: same effect, but shorter storing href at button  
  alert($(this).attr('data-href'));  

});

===============>>#2 票数:1

尝试这个

$('.small').click(function() {
     alert("test");
     window.location.href = $(".events_links").attr("href");
});

===============>>#3 票数:1

在这种情况下,我建议您使用data-attr,而您不想依赖于代码结构和CSS。

  <div class="row flush footer">
    <div class="12u">
      <a class="button button-blue small" data-relative-path="some-location">View Details</a>
    </div>
  </div>

$('.small').click(function(){
    window.location.href = $(this).data('relative-path');
});

===============>>#4 票数:0

您可以尝试以下一种方法:

$('.small').click(function() {
     alert("test");
     window.location.href = $(".evntblk .events_links").attr("href");
});

===============>>#5 票数:0

如果仅需要获取当前.box.panel中单个.event_links对象的href,请执行以下操作:

$('.small').click(function()
   {
       alert("test");
       window.location.href = $(this).closest(".box.panel").find(".events_links").attr("href");
   });

最接近将为您提供与选择器匹配的第一个父元素。 这样,如果您还有其他不在该面板中的.event_links,它们将被跳过。 如果您使用parent(),您将被迫在.small和它的父母之间保持相同的HTML结构。

===============>>#6 票数:0

首先,尝试基于css类加载URL是不好的做法。 那是因为您很可能在单个页面上重复使用css类,从而导致选择多个锚点。

但是,您可以执行以下操作:

$('.small').click(function()
{
    var btn = $(this);

    // find the closest element of click button with class 'event-block'
    // find the element with class 'events_links'
    // change window location to value at href
    window.location.href = btn.closest('.event-block').find('.events_links').attr("href");
});

  ask by afeef translate from so

未解决问题?本站智能推荐:

2回复

无法在jQuery中获取DOM元素

我试图从jQuery选择器数组中获取DOM元素。 但是,它仅返回文本,而不返回我想要的DOM元素。 我想获取DOM元素,这样我就可以获取元素在页面上的位置并滚动到它。 $(this)=列表元素.title =页面上的class =“ title”和“ title small”元素
5回复

无法在JQuery中选择元素并执行简单事件

我无法使用JQuery点击功能在“画布”上进行简单的点击事件。 $(document).ready(function(){ alert("test"); $("#canvas").click(function(){ alert("canvas"); }); $(".middle"
1回复

我无法在我的jquery中选择删除类

我正在尝试实现一个onhover删除选项..但是当我点击时,没有任何反应..可能jquery的选择部分有问题。以下是jquery我累了 甚至连工作都没有。 但它适用于小提琴。 http://jsfiddle.net/rc0tscd4/3/请告诉我哪里出错了注意:这个完整的htm
5回复

jQuery从选定的行中选择所有数据

我有桌子 我想从所有选定的行中获取姓名,姓氏,电子邮件(已选中检查)。 也许名字,姓氏,电子邮件将是数组。 我该怎么做? 我已经试过了: var tableControl= document.getElementById('mytable'); $("#btn").cli
1回复

在jQuery中选择DIV

我有两个ID为#container的div。 第一个是class .current-content [div#container -- div.current-content] 第二个包含在类.next-content中 ,包含类current-content [div#conta
1回复

为什么我无法在此JQuery脚本中检索和打印从DOM中检索到的元素的标记名?

我在JavaScript和JQuery方面还很陌生,并且试图检索表示标签的对象的标签名称会发疯。 这是我的JQuery脚本: 如您所见,这是在用户单击设置了CSS类打开设置的thead对象时自动执行的,因此$(this)应该表示DOM中单击的thead元素(这是我的推理正确还是我遗
2回复

我在dom中看到一个属性 元素,但无法在jQuery中检索到

我正在尝试从<td valign="top" width="25%">获得值width="25%" ,我是从<td>下方的子孙位置开始的。 在我的目标<td valign="top" width="25%">之间可能可能有更多的<td>元素。
2回复

google maps从angularjs指令中选择infowindow DOM元素

我需要按类'gm-style-iw'选择元素来修复Inf​​owindow中的一些样式。 选择发生在angularjs指令内。 ui-view - 使用IW内容加载指令。 map在该指令内初始化。 在指令的控制器初始化我必须编辑类'gm-style-iw'的元素。 确实
2回复

在jQuery中选择* specific *元素

我是jQuery的新手,我想通过将鼠标悬停在按钮上来为单个图像添加一个类 - 我认为我知道该怎么做,事实证明我没有。 问题是我有几个.service部分,每个部分都有自己的.service button 。 因此,最终结果如预期:当我将鼠标悬停在按钮上时,所有.service-image
2回复

使用jQuery在CSS中实现父选择器,该选择器会自动应用于DOM中的新元素

CSS不支持父选择器,例如“选择包含>所有<p> > ”。 这里提出的一种解决方案是使用jQuery,例如: $('#parent:has(#child)').addClass('my-special-class'); 但是,