更改弹出窗口中使用的按钮类的数据内容

时间:2013-03-03 20:58:12

标签: javascript button

我有一个按钮类,我用于twitter popover,我的代码如下:

<button class="btn btn-success" id="chaticon" data-original-title="Users Online" data-content="&lt;a href='#'&gt; OMGTEST &lt;/a&gt;">

我想要做的是通过javascript修改data-content

天真地我试着这样做:

document.getElementById("chaticon").data-content = "new content";

它没有用,有关我怎么做的任何想法?

2 个答案:

答案 0 :(得分:2)

使用HTMLElement的内置访问器。

getAttribute(attributeName)
setAttribute(attributeName,newValue);
像这样:

var yourElement = document.getElementById("chaticon");
var dataVal = yourElement.getAttribute("data-content");
var newData = "new data";
yourElement.setAttribute("data-content",newData);

这是一个简单的演示:http://jsfiddle.net/hpfk3/

修改

你可能应该在问题中包含jquery和popover,而不仅仅是询问按钮元素。由于这些可用,您可以更改内容:

//store chat icon jQuery object
var chatIcon = $("#chaticon");

//change data attribute on element
//change jquery data object content
//call setcontent method
chatIcon.attr("data-content","new data").data('popover').setContent();

//target the popover element and restore its placement definition
chatIcon.data('popover').$tip.addClass(chatIcon.data('popover').options.placement);

答案 1 :(得分:1)

尝试设置属性

document.getElementById("chaticon").setAttribute('data-content','new content');