【问题标题】:How to get innerHTML of a div.id using jQuery, which is updated dynamically如何使用动态更新的 jQuery 获取 div.id 的 innerHTML
【发布时间】:2016-08-16 10:18:21
【问题描述】:

var obj = {
  "Ethernet": "Up",
  "Ethernet": "Down",
  "USB_Dongle": "Down",
  "USB_Dongle": "Down",
  "X_BROADCOM_COM_PPTPAC": "Down",
  "wanLink": "Up"
}

function renderStatusWanLink(obj) {
  var tmp = jQuery('#WAN_Line').html();
  console.log(tmp);

  if (obj !== false) {
    jQuery('#WAN_Line').html(obj.wanLink);
  }
}

renderStatusWanLink(obj);
renderStatusWanLink(obj);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<table class="az-table az-table-status table table-condensed table-hover table-striped">
  <tbody>
    <tr>
      <td>WAN Status</td>
      <td>:</td>
      <td id="WAN_Line" width="49%"></td>
    </tr>
  </tbody>
</table>

我正在尝试首先从 div #WAN_Line 中获取 html/文本内容。最初它将是空的。但是下次它应该在更新时返回我一些值。但它总是返回空。

HTML:(这是在一张表中)

<tr>
    <td>WAN Status</td>
    <td>:</td>
    <td id="WAN_Line" width="49%"></td>
</tr>

Javascript:

function renderStatusWanLink(obj)
{
    var tmp = jQuery('#WAN_Line').html();
    console.log(tmp);

    if (obj !== false) {

        jQuery('#WAN_Line').html(obj.wanLink);            
    }
}

obj =

{"Ethernet":"Up",
"Ethernet":"Down",
"USB_Dongle":"Down",
"USB_Dongle":"Down",
"X_BROADCOM_COM_PPTPAC":"Down",
"wanLink":"Up"}

【问题讨论】:

  • 可以把你的html代码和更新div的功能也放在这里吗?
  • @JekinKalariya 更新了 html 代码。
  • 你怎么叫renderStatusWanLink
  • 请同时说明您如何尝试通过调用 renderStatusWanLink 来更新 td 值
  • @JekinKalariya 请假设 obj.wanLink 中有一些数据。因为它正在被填充并且可以在浏览器上看到。 obj是ajax调用返回的json格式值,传递给这个函数。

标签: javascript jquery html innerhtml


【解决方案1】:

如果一切顺利,它应该可以工作。使用您给定的对象和代码,下面的代码对我来说非常适合。在下面的代码spinet单击按钮更改td html

<html>
<head>
<script src="js/jquery-1.7.1.min.js"></script>


<script type="text/javascript">

var obj={"Ethernet":"Up",
        "Ethernet":"Down",
        "USB_Dongle":"Down",
        "USB_Dongle":"Down",
        "X_BROADCOM_COM_PPTPAC":"Down",
        "wanLink":"Up"};
    function removeLine() {

        var tmp = jQuery('#WAN_Line').html();
        console.log(tmp);

        $('#WAN_Line').html("updated code");
    }


    function renderStatusWanLink()
    {
        var tmp = jQuery('#WAN_Line').html();
        console.log(tmp);

        if (obj !== false) {

            jQuery('#WAN_Line').html(obj.wanLink);            
        }
    }
</script>



</head>
<body>
    <div >

        <table>

            <tr>
                <td>WAN Status</td>

                <td id="WAN_Line" width="49%"></td>
            </tr>
        </table>
    </div>
    <button onclick="renderStatusWanLink()">click to change text</button>

</body>
</html>

【讨论】:

  • 是的,即使对我来说,在这段代码 sn-p 中也是如此。但不是在实际应用中。让我在控制台中打印 obj 回来。
  • 尝试在网络调用时调试您的对象,并在此处输入来自网络的确切值
  • 发现了问题,我认为某些 id 名称与全局 html 元素冲突,将其更改为 #WAN_Line1 有效。很傻的理由。 .
猜你喜欢
  • 1970-01-01
  • 2016-05-17
  • 1970-01-01
  • 2013-09-18
  • 1970-01-01
  • 2015-12-10
  • 1970-01-01
  • 2014-12-30
  • 1970-01-01
相关资源
最近更新 更多