1

Preciso criar uma função semelhante a esta:

criarBotoes({
  "Abrir": function(dados){
    alert("Abrindo...");
    console.log(dados);
  },
  "Fechar": function(dados){
    alert("Fechar...");
    console.log(dados);
  },
});

Tentei da seguinte forma:

function criarBotoes(botoes){
  for(var texto in botoes){
    $("<button>",{
        text: texto,
        click: botoes[texto],
        appendTo:$('body')
      });
  }
}

criarBotoes({
  "Abrir": function(dados){
    alert("Abrindo...");
    //console.log(dados);
  }, 
  "Fechar": function(dados){
    alert("Fechando...");
    //console.log(dados);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

Mas não consigo passar valores para a função botoes[texto]().

1 Resposta 1

1

Boa noite!

Modifiquei o seu objeto de botões para ser um array, assim fica mais fácil iterar sobre ele, e cada botão vira um objeto, sendo mais simples para acessar suas propriedades, inclui também duas versões do código uma usando ES5(Seu caso) e outra usando ES6(Caso você esteja interessado) no final ficou assim:

// Versão ES5
var botoes = [
  {
    texto: "Abrir",
    metodo: function(dados){
      alert("Abrindo...");
      console.log(dados);
    }  
  },
  {
    texto: "Fechar",
    metodo: function(dados){
      alert("Fechar...");
      console.log(dados);
    },
  }
];

botoes.forEach(function(botao) {
  $('<button>', {
    text: botao.texto,
    click: botao.metodo,
    appendTo: $('body')
  });
});

//Versão ES6
const botoes = [
  {
    texto: "Abrir",
    metodo: (dados) => {
      alert("Abrindo...");
      console.log(dados);
    }  
  },
  {
    texto: "Fechar",
    metodo: (dados) => {
      alert("Fechar...");
      console.log(dados);
    },
  }
];

botoes.forEach((botao) => {
  $('<button>', {
    text: botao.texto,
    click: botao.metodo,
    appendTo: $('body')
  });
});
1
  • Boa sujestão, não resolveu meu problema, mas me ajudou a achar a solução. Só precisei mudar isso: [...] click: function(){ botao.metodo("Olá Mundo!") } [...] 9/09/2016 às 2:25

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .