Question

我有一个javascript函数，可以删除现有按钮并添加新按钮。

以下是代码：

 function FunctionName(){
     ("button").remove();
     // This works fine.
     //but however, with the following add code, I don;t get a jquery ui button.
     var element  = document.createElement("input");
     element.setAttribute("type","button");
     // other code
     divName = get <div> by ID;
     divName.appendChiled(element);
 }

有没有办法动态添加jquery ui按钮：

像：

divName.add("button");

它不起作用......

Answer 1

使用jQuery添加jQuery UI按钮：

$('#selector') // Replace this selector with one suitable for you  
  .append('<input type="button" value="My button">') // Create the element  
  .button() // Ask jQuery UI to buttonize it  
  .click(function(){ alert('I was clicked!');}); // Add a click handler

Answer 2

非常确定您可以通过调用button()

来使用jQuery-UI按钮输入任何输入

var element = document.createElement("input").button();

Answer 3

我刚刚使用以下代码动态创建了一个按钮。关键部分是.button（）部分，它似乎对我有用。

var self = this;
var exitButton = $(document.createElement("a"));
exitButton.attr({
    'href': '#',
    'id': 'exitSlideshowButton',
});
exitButton.click(function(event){
    event.preventDefault();
    self.exitSlideshow();
});
exitButton.text("Exit Slideshow Mode")
exitButton.button();
exitButton.appendTo("body");

Answer 4

这段代码对我有用

$('#selector').append('<input type="button" value="My button">');

$('#selector').click(function(){ alert('I was clicked!');});

Answer 5

我认为@Stony很接近，除了.button()和.click()方法被添加到原始选择器元素，而不是实际按钮。您应该为按钮创建一个id，然后选择该按钮并在其上调用button().click()。

这可能会导致某种异常，因为在该帖子下对button()的调用进行了评论。

Answer 6

默认情况下，

Ninja UI以这种方式工作，而不会破坏被覆盖的HTML。

您可以在DOM准备就绪之前将按钮创建为变量。

var $button = $.ninja.button({
  html: 'Post Your Answer'
}).select(function () {
  // Your action here.
});

当DOM准备好后，可以在任何你想要按钮的地方附加。

$('body').append($button);

Answer 7

我从@Stony申请，它对我有用。

function addMyButton(btID){
    var temp = "<button id='" + btID + "'>My Button</button>";
    $( "#selector" ).html(temp);
    $( "#" + btID )
        .button()
        .click(function(){
            alert( "I was clicked!");
        });
}

动态添加Jquery ui按钮

7 个答案: