Skip to main content
replaced http://pt.stackoverflow.com/ with https://pt.stackoverflow.com/
Fonte Link

Baseada na resposta do Sergioresposta do Sergio, criei um exemplo mais simples sem o uso do eval().

var input = document.getElementById('calculator');
var result = document.getElementById('result');
input.addEventListener('keyup', calcular);
function calcular(){
    //var conta = eval(this.value);
    var conta = new Function("return " + this.value);
    var resultado = conta();
    
    result.innerHTML = resultado;
}
<input type="text" id="calculator" />
<div id="result"></div>

Neste caso uma function é criada com base na string enviada. Perceba que alguns erros aparecerão no console em alguns momentos, pois o tipo de retorno "1+1+", por exemplo, não é válido.

Neste caso, você poderia resolver com uma simples validação antes de criar a função. Isso resolveria o problema de "caixa preta" citado pelo hugomg em sua respostacitado pelo hugomg em sua resposta. Mas ainda assim teríamos o problema do XSS.

Essa resposta tem apenas como finalidade somar conhecimento das diversas possibilidades possíveis de resolver seu problema de forma simples.

AquiAqui você pode encontrar muitos outros exemplos.

Baseada na resposta do Sergio, criei um exemplo mais simples sem o uso do eval().

var input = document.getElementById('calculator');
var result = document.getElementById('result');
input.addEventListener('keyup', calcular);
function calcular(){
    //var conta = eval(this.value);
    var conta = new Function("return " + this.value);
    var resultado = conta();
    
    result.innerHTML = resultado;
}
<input type="text" id="calculator" />
<div id="result"></div>

Neste caso uma function é criada com base na string enviada. Perceba que alguns erros aparecerão no console em alguns momentos, pois o tipo de retorno "1+1+", por exemplo, não é válido.

Neste caso, você poderia resolver com uma simples validação antes de criar a função. Isso resolveria o problema de "caixa preta" citado pelo hugomg em sua resposta. Mas ainda assim teríamos o problema do XSS.

Essa resposta tem apenas como finalidade somar conhecimento das diversas possibilidades possíveis de resolver seu problema de forma simples.

Aqui você pode encontrar muitos outros exemplos.

Baseada na resposta do Sergio, criei um exemplo mais simples sem o uso do eval().

var input = document.getElementById('calculator');
var result = document.getElementById('result');
input.addEventListener('keyup', calcular);
function calcular(){
    //var conta = eval(this.value);
    var conta = new Function("return " + this.value);
    var resultado = conta();
    
    result.innerHTML = resultado;
}
<input type="text" id="calculator" />
<div id="result"></div>

Neste caso uma function é criada com base na string enviada. Perceba que alguns erros aparecerão no console em alguns momentos, pois o tipo de retorno "1+1+", por exemplo, não é válido.

Neste caso, você poderia resolver com uma simples validação antes de criar a função. Isso resolveria o problema de "caixa preta" citado pelo hugomg em sua resposta. Mas ainda assim teríamos o problema do XSS.

Essa resposta tem apenas como finalidade somar conhecimento das diversas possibilidades possíveis de resolver seu problema de forma simples.

Aqui você pode encontrar muitos outros exemplos.

Fonte Link
Jedaias Rodrigues
  • 7mil
  • 3
  • 40
  • 112

Baseada na resposta do Sergio, criei um exemplo mais simples sem o uso do eval().

var input = document.getElementById('calculator');
var result = document.getElementById('result');
input.addEventListener('keyup', calcular);
function calcular(){
    //var conta = eval(this.value);
    var conta = new Function("return " + this.value);
    var resultado = conta();
    
    result.innerHTML = resultado;
}
<input type="text" id="calculator" />
<div id="result"></div>

Neste caso uma function é criada com base na string enviada. Perceba que alguns erros aparecerão no console em alguns momentos, pois o tipo de retorno "1+1+", por exemplo, não é válido.

Neste caso, você poderia resolver com uma simples validação antes de criar a função. Isso resolveria o problema de "caixa preta" citado pelo hugomg em sua resposta. Mas ainda assim teríamos o problema do XSS.

Essa resposta tem apenas como finalidade somar conhecimento das diversas possibilidades possíveis de resolver seu problema de forma simples.

Aqui você pode encontrar muitos outros exemplos.