如何通過javascript更新html中的數字？

選民投票後，我想更新計數。如何通過javascript更新html中的數字？

<form class="vote-form" action=""> 
    <div id="{{key}}" class="vote-count">{{votes}}</div> 
    <input class="vote-button" type="submit" class="text-button" value="vote+"/> 
    <input type="hidden" class="brag" name="brag" value="{{key}}"> 
    <input type="hidden" class="voter" name="voter" value="{{current_user.fb_id}}"> 
</form> 

<script type="text/javascript"> 
    $(function() { 
    $('.error').hide(); 
    $(".vote-form").submit(function() { 
     var inputs = $(this).find('input:hidden'); 
     var key = $('input.brag', this).val(); 
     $.ajax({ 
     type: "POST", 
     url: "/bean", 
     data: inputs, 
     success: function() { 
      //not sure how to do this, I want to increment {{votes}} 
      $('#' + key).innerHTML = "foo"; 
     } 
     }); 
     return false; 
    }); 
    }); 
</script>

來源

2011-01-07 Will Curran

什麼是「{{key}}」？看起來像一些生成HTML的服務器端代碼。如果是這樣，你還需要在JavaScript中使用它。如果不是，那麼這不是合法的`id`屬性。 :) – Phrogz 2011-01-07 21:34:53

鍵是由Django模板生成的。那麼javascript會不會讀取由{{key}}生成的值？ – 2011-01-07 21:37:10

我以前沒有看到你的`input.brag`代碼。是的，這將工作得很好。請注意，您也可以刪除`class =「brag」`，並使用`var key = $（'input [name = brag]'）。val（）;` – Phrogz 2011-01-07 21:39:31

var $div = $('#' + key), 
    intValue = parseInt($div.html(), 10); 

$div.html(++intValue);

來源

2011-01-07 21:35:22

如果你想盲目加1，任何值在HTML已經：

$('#'+key).html(function(i,old){ return old*1 + 1; });

我會，但是，其倡導的服務器響應返回正確的計票/bean並使用它來更新HTML。

來源

2011-01-07 21:36:40 Phrogz

如何通過javascript更新html中的數字？

回答

相關問題