3

出于某种原因，我无法让jQuery html()函数工作。我尝试了以下方法：

  1. 查找特定的 div：

    var div = $("#divId");

    结果：工作

  2. 测试我是否可以将它与 jQuery 一起使用：

    alert($(div).attr("id"));

    结果：作品；显示了 id

  3. 获取 div 中的 html：

    alert($(div).html());

    结果：不起作用；空警报

  4. 使用 innerHTML 获取 div 中的 html：

    alert(document.getElementById($(div).attr("id")).innerHTML);

    结果：作品；div 内容显示在警报中

实际代码：

$(document).ready(function(){

var autocomp = namespace('mx.autocomp');

autocomp.overlay = (function() {

    var formId;
    var $searchValueComp;
    var $searchResultComp;

    function init(inFormId, inSearchValue){
        formId = inFormId;
        $searchValueComp = $("#"+inFormId).find("[id$="+inSearchValue+"]");
        $searchResultComp = $("#"+inFormId).find("[id$=searchResult]");
    }

    function handleOverlay(){
        var fn = window[formId + "OverlayWid"];
        var result = document.getElementById($searchResultComp.attr("id")).innerHTML;

        if($searchValueComp.val().length==0){
            fn.hide();
        }

        // Test - This does not work as I get an empty alert
        alert($searchResultComp.html());

        // Edit1: New test, this works.
        // When I use this javascript, I start with initializing the script from the page
        // using the "init(inFormId, inSearchValue)" function. The handleOverlay() function
        // is called through the "oncomplete='mx.autocomp.overlay.handleOverlay();'" of a
        // p:remoteCommand that executes a search in the db and then update the div called
        // "searchResultComp".
        //
        // Only reason I can think of why the code below works is that the jQuery object $test 
        // is created after the div called "searchValueComp" has been updated by p:remoteCommand.
        // However, I don't understand why the jquery object "searchValueComp" wouldn't have
        // access to the same content as it should look for it first when the html() function 
        // is called. Or is the content of the div searchValueComp set immediately when the 
        // object is created in the "init" function?
        var $test = $("#"+formId).find("[id$=searchResult]");
        alert($test.html());

        // I need to check if the div: "searchResultComp" has any content. 
        // As I don't get $searchResultComp.html() to work, I'm forced to 
        // use the "getElementById" way instead. 
        if(result.length==0){
            fn.hide();
        }else{
            fn.show();
        }

    }

    function print(text){
        $("#textCheck").prepend(text + '\n');
    }

    return {
        handleOverlay: handleOverlay,
        init: init
    };

})();

});

我究竟做错了什么？

4

4 回答 4

0

试试这个

HTML

<div id="mydiv">
    <select class="myclass">...</select>
    <select class="myotherclass">...</select>
</div>

JS代码

var $div = $('div');
alert($div.html());

现场演示

于 2013-01-23T19:47:56.247 回答
0

Peter Campbell 在这个问题的后续问题中给了我答案：jquery 对象的“内容”是否在创建时立即设置？

显然，我必须重新初始化变量 searchResultComp 以获得预期的结果。

于 2013-01-24T10:31:32.340 回答
-1

将 jQuery 对象分配给变量时，通常以 a 开头变量$以使其作为 jQuery 对象脱颖而出。这不会影响您的代码，但从开发人员的角度来看更容易。

var $div = $('div');

要获取 html，请执行以下操作：

$div.html();
于 2013-01-23T19:47:20.703 回答
-1

您需要引用 div，如下所示：

$("div").html();

此外，如果页面上有多个 div 元素，则需要指定一个。您可以通过添加一个类或使用 .eq() 过滤结果来做到这一点。

这是一个例子。 http://jsfiddle.net/W8qkE/

于 2013-01-23T19:51:30.747 回答