---
name: "up:fragment:keep"
area: "API"
kind: "DOM event"
parent: "up.fragment module"
url: "https://unpoly.com/api/up:fragment:keep"
---
<nav aria-label="Unpoly docs">[All docs](https://unpoly.com/index.md) · [up.fragment module](https://unpoly.com/api/up.fragment.md)</nav>

# up:fragment:keep

This event is emitted before an existing element is [kept](https://unpoly.com/learn/keeping-elements.md) during a render pass.

Event listeners can call `event.preventDefault()` on an `up:fragment:keep` event to prevent the element from being kept. If the event is prevented, the element will be replaced with a fragment from the response.

<nav aria-label="Guides">

- [Learn: Keeping elements](https://unpoly.com/learn/keeping-elements.md)

</nav>

## Example {#example}

The following would only keep an `<audio up-keep>` element as long as it plays the same song (as identified by the tag's `src` attribute):

```js
up.on('up:fragment:keep', 'audio', function(event, element) {
  if (element.getAttribute('src') !== event.newFragment.getAttribute('src')) {
    // Preventing the event forces an update
    event.preventDefault()
  }
})
```

You may also define an `up:fragment:keep` listener in HTML using an [`[up-on-keep]`](https://unpoly.com/api/up-keep.md#up-on-keep) attribute.

---

## Event properties {#properties}

### event.preventDefault() {#event.preventDefault}

(required)

Prevents the fragment from being kept.

The fragment will be replaced with `event.newFragment`.

### event.target {#event.target}

(required)

The fragment that will be kept.

Type: [Element](https://developer.mozilla.org/en-US/docs/Web/API/Element)

### event.newFragment {#event.newFragment}

(required)

The new element from the response.

Type: [Element](https://developer.mozilla.org/en-US/docs/Web/API/Element)

### event.newData {#event.newData}

(required)

The [data](https://unpoly.com/learn/data.md) attached to the new element.

Type: [Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects)

### event.renderOptions {#event.renderOptions}

(required)

An object with [render options](https://unpoly.com/api/up.render.md#parameters) for the current render pass.

Type: [Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects)