home

หน้าแรก
 Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

PushState State Object ใน HTML5 History API คืออะไร?

history.pushState(state, title, url)

state object คือข้อมูลใดๆ ที่ต้องการเก็บไว้กับ History Entry (Serializable Object)

ตัวอย่าง: บันทึกสีที่เลือก

function selectColor(color) {
    var state = { selectedColor: color };
    var title = "Page Title";
    var path = "/" + color;
    history.pushState(state, title, path);
}

// เมื่อผู้ใช้กด Back/Forward
window.addEventListener('popstate', function(event) {
    var state = event.state;
    if (state) {
        selectColor(state.selectedColor); // คืนค่าสีจาก state object
    }
});

ข้อจำกัด: State object ต้อง Serialize ได้ (JSON) ขนาดไม่เกิน ~640k (ขึ้นอยู่กับเบราว์เซอร์)