我使用表格,当我按下按钮时,结果会添加到该表格中。这些行有一个需要选择的按钮,但它不起作用
我想点击按钮并提醒他们说什么。
链接到小提琴: https://jsfiddle.net/KukApep3/v62e4quc/6/
var receitas = {
Lulas: ["Arroz de Lulas"],
Vaca: ["Bitoque", "Estufado de Vaca"]
};
function get_receita(alimento) {
var pesquisa = [];
for (var key in receitas) {
if (receitas.hasOwnProperty(key)) {
if (key == alimento) {
pesquisa.push(receitas[key]);
};
};
};
return pesquisa[0];
};
$("#pesquisar_receita").click(function() {
var alimento = document.forms["form_refeicao"]["alimento"].value;
$("table").find("tr:gt(0)").remove();
//$("#resultados").css("display", "block");
var pesquisa = get_receita(alimento);
for (var i = 0; i < pesquisa.length; i++) {
//$("#resultado_"+i).text(pesquisa[i]);
$("table tr:last").after("<tr><td>" + pesquisa[i] + "</td><td><button>Escolher</button></td></tr>");
};
$("#resultados").css("display", "block");
});
$("table button").click(function() {
$(this).closest('tr').find('td').each(function(colIndex, c) {
refeicao = c.textContent;
});
alert(refeicao);
})
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="form_refeicao" onSubmit="return false">
<p>
<label>Prato Principal:</label>
<select id="alimento">
<option value="Vaca">Bife: Vaca</option>
<option value="Frango">Bife: Frango</option>
<option value="Porco">Bife: Porco</option>
<option value="Atum">Peixe: Atum</option>
<option value="Espadarte">Peixe: Espadarte</option>
<option value="Lulas">Peixe: Lulas</option>
<option value="Pescada">Peixe: Pescada</option>
</select>
<button id="pesquisar_receita">Pesquisar</button>
</p>
<div id="resultados" style="display: none">
<table>
<tr>
<th colspan="2">Resultados:</th>
</tr>
</table>
</div>
</form>
&#13;