2009-07-24 36 views
11

Giả sử tôi có vòng lặp PHP hiển thị dữ liệu mà bạn có thể xóa. Tôi đang sử dụng AJAX, vì vậy khi bạn xóa một hàng, nó xử lý một tập lệnh PHP và hàng biến mất khỏi trang.jQuery: Làm thế nào để có được nội dung của một khoảng, trừ đi 1, và thay thế nội dung của span với số mới?

Tuy nhiên, tôi có nội dung có nội dung "Có 5 mục". Tôi muốn "5" thay đổi khi một mục bị xóa. Tôi đã tìm ra cách dễ nhất sẽ được trừ bằng một trong Javascript.

Vấn đề là, tôi thực sự không biết làm thế nào. Nếu ai đó có thể chỉ cho tôi đi đúng hướng, điều đó thật tuyệt.

+0

Tôi đã cập nhật bài đăng của mình. Bây giờ nó có thể giúp bạn –

Trả lời

18

Giả sử số lượng là trong một khoảng thời với id 'cnt':

$("#cnt").text($("#cnt").text()-1) 

Edit:
Safer Version:

var cntTag = $("#cnt:first"); 
if (cntTag.Length == 1) 
{ 
    var cnt = parseInt(cntTag.text()); 
    if (!isNaN(cnt)) 
    { 
     cnt--; 
     cntTag.text(String(cnt)); 
    } 
} 
+0

Cảm ơn một triệu! Tôi muốn làm điều này hơn là một "refresh" AJAX vì đây là ít căng thẳng trên máy chủ. Máy chủ tôi đang làm việc trên khá cũ và hầu như không thể xử lý một số yêu cầu AJAX mà tôi đã có. – dallen

+0

Tôi có thể thấy điều này có ích trong tương lai gần +1 – JasonDavis

+1

Điều đó có an toàn hơn với parseInt() trong đó không? Javascript là khá khoan dung về điều đó loại, nhưng nó có vẻ như nó có thể là tiện dụng chỉ trong trường hợp ... –

1

Cập nhật danh sách đầy đủ nếu có thay đổi gì đó. Kiểm tra nó bằng cách sử dụng AJAX khoảng 5 giây một lần.

Hoặc

There are <span id="number">5</span> items. 

và sau đó thay đổi giá trị của tuổi với id 'số' với số lượng hiện tại của hàng sau khi xóa. Stack Overflow sử dụng phương thức này khi một câu trả lời mới được đăng khi bạn thêm một câu trả lời mới.

Bạn có thể trừ bằng

parseInt($("span").html()); 
7

HTML:

There are <span class="numitems">5</span> items. 

JS:

var span = $("span.numitems"); 
span.html(parseInt(span.html()) - 1); 
+0

Cách dễ nhất để sử dụng .... – Mikeys4u

3

Hãy nói rằng chúng ta bắt đầu với ba:

<p>There are <span id='number'>3</span> items.</p> 
<ol id ='thelist'> 
    <li> one 
    <li> two 
    <li> three 
</ol> 

Bây giờ chúng ta cần một số jQuery để xử lý các sự kiện thay đổi trong danh sách

$(function(){ 
    $('#thelist').bind('change', function(){ 
    $('#number').html($('#thelist li').length) 
    } 
} 

mỗi khi thay đổi #thelist, nó sẽ cập nhật leng th in #number. Một lợi thế của phương pháp này là bằng cách liên kết sự kiện thay đổi, bạn không cần setInterval trên bộ hẹn giờ hoặc bất kỳ thứ gì như thế. Tất cả mọi thứ chỉ làm những gì nó phải.

+0

Rất ấn tượng ... Tôi sẽ xem nếu tôi có thể làm lại danh sách của tôi vào định dạng này. Cảm ơn! – dallen

Các vấn đề liên quan