---
name: "up.fragment.abort"
area: "API"
kind: "JavaScript function"
parent: "up.fragment module"
url: "https://unpoly.com/api/up.fragment.abort"
---
<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.abort([element], [options])

[Aborts requests](https://unpoly.com/learn/aborting-requests.md) targeting a fragment or layer.

Always emits the event [`up:fragment:aborted`](https://unpoly.com/api/up:fragment:aborted.md), regardless of whether there were requests to abort. If a request was aborted, the event [`up:request:aborted`](https://unpoly.com/api/up:request:aborted.md) will also be emitted.

<nav aria-label="Guides">

- [Learn: Aborting requests](https://unpoly.com/learn/aborting-requests.md)

</nav>

<nav aria-label="Contents">

#### Contents

- [Aborting requests targeting a fragment](#aborting-requests-targeting-a-fragment)
- [Aborting requests targeting a layer](#aborting-requests-targeting-a-layer)
- [Aborting all requests](#aborting-all-requests)
- [Low-level API](#low-level-api)
- [Parameters](#parameters)

</nav>

## Aborting requests targeting a fragment {#aborting-requests-targeting-a-fragment}

To abort pending requests [targeting](https://unpoly.com/learn/targeting-fragments.md) an element or its descendants, pass a reference or CSS selector for that element:

```js
up.fragment.abort(element)
up.fragment.abort('.foo')
```

You may also pass an `{ origin }` or `{ layer }` option to help look up the selector.

## Aborting requests targeting a layer {#aborting-requests-targeting-a-layer}

To abort all requests targeting elements on a given layer, pass a [`{ layer }` option](https://unpoly.com/learn/targeting-other-layers.md):

```js
up.fragment.abort({ layer: 'root' })
```

## Aborting all requests {#aborting-all-requests}

This would abort requests targeting any elements on any layer:

```js
up.fragment.abort({ layer: 'any' })
```

## Low-level API {#low-level-api}

There is also a low-level [`up.network.abort()`](https://unpoly.com/api/up.network.abort.md) function, which aborts requests matching arbitrary conditions.

If possible, prefer `up.fragment.abort()`, which matches requests by screen region. Only when requests are aborted by screen region, components can [react to being aborted](https://unpoly.com/api/up:fragment:aborted.md).

---

## Parameters {#parameters}

### Matching requests {#parameters-matching-requests}

#### [element] {#element}

(optional)

The element (or selector) for which requests should be aborted.

May be omitted with `{ layer }` option.

Type: string | [Element](https://developer.mozilla.org/en-US/docs/Web/API/Element) | [List](https://unpoly.com/api/List.md)<[Element](https://developer.mozilla.org/en-US/docs/Web/API/Element)>

#### [options.layer] {#options.layer}

(optional)

The [layer](https://unpoly.com/learn/targeting-other-layers.md) for which requests should be aborted.

May be omitted with `element` argument.

Type: string | [up.Layer](https://unpoly.com/api/up.Layer.md)

#### [options.origin] {#options.origin}

(optional)

The element causing requests to be aborted.

This is used to look up an `element` selector or `{ layer }` name.

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

#### [options.except] (Experimental) {#options.except}

(optional)

A request that should not be aborted, even if it matches the conditions above.

Type: [up.Request](https://unpoly.com/api/up.Request.md)

### Debugging {#parameters-debugging}

#### [options.reason] {#options.reason}

(optional)

The reason for aborting requests.

The promise by an aborted [`up.request()`](https://unpoly.com/api/up.request.md) will reject with this reason to help debugging an unexpected aborting.

If omitted, a default message will describe the abort conditions.

Type: string