Javascript $(var).html(data); 不工作

Question

我目前正在使用 javascript 尝试使用 ajax 更新页面。 但是，使用 .html 使用 i 传入的参数更新页面结束时不会产生任何更改。 html 页面是一个按钮网格，我正在尝试使用“flaggedcell”img 更新右键单击的按钮。 我可以成功记录我要替换的数据，但是，在该行的正下方，the.html function 没有做任何事情。

Javascript：

 $(function() { console.log("Page is ready"); $(document).bind("contextmenu", function(e) { e.preventDefault(); console.log("Right click. Prevent context menu from showing.") }); $(document).on("mousedown", ".game-button", function(event) { switch (event.which) { case 1: var buttonNumber = $(this).val(); console.log("Button number " + buttonNumber + " was left clicked"); break; case 2: alert('Middle mouse button is pressed'); break; case 3: event.preventDefault(); var buttonNumber = $(this).val(); console.log("Button Number " + buttonNumber + " was right clicked"); doFlag(buttonNumber); break; default: alert('Nothing'); } }); }); function doFlag(buttonNumber) { $.ajax({ datatype: "json", method: 'POST', url: '/grid/flag', data: { "cellNumber": buttonNumber }, success: function(data) { // this data logs succesfully console.log(data); //this changes nothing $("#" + buttonNumber).html(data); } }) }

数据 html：

@model MinesweeperASP.NET.Models.Cell
@{
    //store image names in an array for more efficient code.
    string[] imageNames = { "UnoenedCell.png", "green.png", "bomb.png", "FlaggedCell.png" };
    int i = 0;
}
 
@if (!Model.isVisited && Model.isFlagged)
{
    i = 3;
}


<button class="game-button" type="submit" value="@Model.rowNumber,@Model.colNumber" name="cellNumber" asp-controller="Grid" asp-action="HandleLeftClick">
    <img class="game-button-image" src="~/img/@imageNames[i]" />
    <div class="button-label">
        @Model.rowNumber
        ,
        @Model.colNumber
    </div>
</button>

开发者工具output：

Page is ready
site.js?v=yEzTfLHBcae6F8YYH3SeJjYAxKx_gxgY8BqS9gC2o5c:24 Button Number 0,1 was right clicked
site.js?v=yEzTfLHBcae6F8YYH3SeJjYAxKx_gxgY8BqS9gC2o5c:42  


<button class="game-button" type="submit" value="0,1" name="cellNumber" formaction="/Grid/HandleLeftClick">
    <img class="game-button-image" src="/img/FlaggedCell.png" />
    <div class="button-label">
        0
        ,
        1
    </div>
</button>


site.js?v=yEzTfLHBcae6F8YYH3SeJjYAxKx_gxgY8BqS9gC2o5c:5 Right click. Prevent context menu from showing.

Answer 1

您的按钮没有 id 属性。 添加 id 属性并检查它。