Question

我希望我的提交按钮从旁边的输入框中提取值，更改＆＃39;＃＆＃39;到了＆＃39; - ＆＃39;然后传递它，以便我可以提取该用户的相应信息，然后在HTML中填充该字段。但是这个页面只是刷新了一个＆＃39;？＆＃39;被添加到网址。

$("#usernameBtn").click(function() {
    var unTouchedID = $("#userid").val();
    var usrID = unTouchedID.replace("#", "-");

    $.ajax({
        url: "https://owapi.net/api/v3/u/" + usrID + "/stats",
        dataType: 'json',
        data: "", 
        success: function (data) {
        $('#heroStats_elims').html('<h2>'+ data.us.stats.competitive.average_stats.eliminations_avg + '</h2>'); 
    //var avgElims = //data.us.stats.competitive.average_stats.eliminations_avg
        }
    }); });


<div class="form-group">
     <input type="text" class="form-control" placeholder="Enter Battle.net Tag" id="userid">
</div>
<button type="submit" class="btn btn-default" id="usernameBtn">Submit</button>

Answer 1

您需要使用event.preventDefault();作为@Andrew提及，以防止提交页面的默认行为。

$("#usernameBtn").click(function(e) {
  e.preventDefault();

  var unTouchedID = $("#userid").val();
  var usrID = unTouchedID.replace("#", "-");

  $.ajax({
      url: "https://owapi.net/api/v3/u/" + usrID + "/stats",
      dataType: 'json',
      data: "", 
      success: function (data) {
      $('#heroStats_elims').html('<h2>'+ data.us.stats.competitive.average_stats.eliminations_avg + '</h2>'); 
      //var avgElims = //data.us.stats.competitive.average_stats.eliminations_avg
      }
  }); 
});

<div class="form-group">
     <input type="text" class="form-control" placeholder="Enter Battle.net Tag" id="userid">
</div>
<button type="submit" class="btn btn-default" id="usernameBtn">Submit</button>

点击功能不会在页面上更新信息

1 个答案: