Question

我有这个HTML代码：

<div class="category" id="154"> Category </div>

<div class="category2" id="156"> Category2 </div>

<div class="category3" id="157"> Category3 </div>

<div class="category4" id="158"> Category4 </div>
<input type="text" />

因此，在示例中，如果我在文本框中编写id，如何选择具有此ID的div .category并获取内部HTML文本。使用jQuery

Answer 1

因此您只需要使用ID，因为这是一个唯一值（或应该是）

var html = $("#154").html();

注意：如果您确实使用了重复的ID值，请务必注意JQuery只会选择第一个。

如果您想在输入文本框值时执行此操作，则可以在文本框更改事件中执行此操作...

$("input").change(function(){
   var id = $(this).val();
   var element = $("#" + id);
   if(element){
      var html = element.html();
      //do something with html here
   }
});

注意：您可能希望在文本框中放置ID值，以确保获得正确的控制

虽然我强烈建议您找到使用重复ID值的方法，但您可以使用这样的函数来获取您想要的DIV ...

function GetContent(className, id) {
    var result = null;
    var matchingDivs = $("." + className);
    matchingDivs.each(function(index) {
        var div = $(matchingDivs[index]);
        if (div.attr("id") == id) {
            result = div.html();
        }
    });

    return result;
}

Click here for working example

Answer 2

我建议你给文本框一个ID，以防你在页面中添加其他文本框。

但是如果您只有1个文本输入，则以下内容将起作用：

 var id = $('input:text:first').val();
 var innerHtml = $('#' + id).html();

Here is a jsFiddle只要文本框中的文字发生变化，就会使用此技术提醒html。

Answer 3

$("#id.class")

将按类和ID选择必要的元素（当然，将id和class替换为各自的名称。）

将.html()添加到最后将为您提供内容。

即：
$("#id.class").html()

JQuery：选择具有唯一类和ID的元素

3 个答案: