简体   繁体   English

jQuery .load按元素ID

[英]jQuery .load by element ID

Hi I'm trying to load an element from a webpage via ID. 嗨,我正在尝试通过ID从网页加载元素。

My code reads the url from the 'href' attribute of the tag and then loads the page. 我的代码从标记的'href'属性读取网址,然后加载页面。 I'm stripping the document anchor. 我正在剥离文档锚点。

This script works but won't discard the surround elements and loads the entire page. 该脚本有效,但不会丢弃周围的元素并加载整个页面。

<script type="text/javascript">
$(function() {
    var a_href = $('#pycom').attr('href').split('#');
    $('div#pop-up').load(a_href[0] + '#synopsis');
});
</script>

<body>
    <a id="pycom" href="content/documentation/CommandsPython/ls.html#hFlags">ls</a>
</body>

The above link exists locally on my server (XAMPP) as per the 'html' code above. 根据上面的“ html”代码,以上链接在我的服务器(XAMPP)上本地存在。

Below is the element I would like to extract. 以下是我要提取的元素。

<p id="synopsis">
    <code>
        xform([objects...], 
        [<a href="#flagabsolute">absolute</a>=<i>boolean</i>], 
        [<a href="#flagboundingBox">boundingBox</a>=<i>boolean</i>],
        .....
        .....

    </code>

Thanks 谢谢

Jamie 杰米

At first get your page, and then inside the 
content find your element with id named 'synopsis' as below:

 var a_href = $('#pycom').attr('href').split('#');
 $("div#pop-up").load(a_href[0] + " #synopsis" );

It should work, but before that check whether your browser supports mixed content. 它应该可以工作,但是在此之前,请检查您的浏览器是否支持混合内容。 If your url contains http inside https then browser may not support, In that case you have to disallow the checking in the browser. 如果您的网址在https内包含http,则浏览器可能不支持。在这种情况下,您必须禁止在浏览器中进行检查。

Thanks. 谢谢。

OK solved. 好了 I was using jQuery 2.4.1 which apparently has a bug that is supposed to be fixed.. but appears to be not?? 我使用的是jQuery 2.4.1 ,显然有一个应该修复的错误。 see here http://bugs.jquery.com/ticket/14773 看到这里http://bugs.jquery.com/ticket/14773

I am instead using jQuery 1.11.3 我改为使用jQuery 1.11.3

below is my final code: 下面是我的最终代码:

<script type="text/javascript" src="content/scripts/jquery-1.11.3.js"></script>
<script type="text/javascript">
    $(function() {
        var moveLeft = -10;
        var moveDown = 10;

        $('a#pycom').hover(function(e) {
            var a_href = $(this).attr('href').split('#');
            $('#pop-up').load(a_href[0] + ' #synopsis');
            $('div#pop-up').show().css('top', e.pageY + moveDown).css('left', ((e.width/100)*1) + moveLeft);
        }, function() {
            $('div#pop-up').hide();
        });
    });
</script>

The following method using .get also works exactly the same except gives the benefit of being able to process the returned string in the callback.. in this case the trailing section of the requested selected element... very nice stuff. 以下使用.get的方法也完全相同,不同之处在于它能够处理回调中返回的字符串。在这种情况下,所请求的选定元素的尾部非常好。

$('a#pycom').hover(function(e) {
    var a_href = $(this).attr('href').split('#');
    $.get(a_href[0], function(response) {
        $('#pop-up').html($(response).filter('#synopsis').html().split('<br>')[0]);
        });    
    });

Now owning jQuery like a BOSS!! 现在拥有像BOSS一样的jQuery !!

jQuery。行动起来!

Thank you to all those who helped out. 感谢所有提供帮助的人。

Chur! 库尔!

J Ĵ

You should not give any space in the URL. 您不应在URL中留任何空格。 There is a space before ' #synopsis'. “#简介”前有一个空格。

 $('div#pop-up').load(a_href[0] + '#synopsis');

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM