What causes a browser to redirect when trying to update the value of the alt field in a Wordpress media image?

Attempting to create a bookmarklet for the Wordpress image gallery manager that triggers the sidebar when an image is clicked. The sidebar contains fields for alt text (input), legend, and description (both textarea).

<a href="javascript:var t=document.querySelectorAll('div.media-sidebar label input');var a=t[2];var u=document.querySelectorAll('div.media-sidebar textarea');var b=u[0];var v=document.querySelectorAll('div.media-sidebar label input');var c=u[1];a.value='Hello';">Duplicate</a>

After clicking the link, I get redirected to a new page instead of setting the desired text. Not sure how to resolve this issue as it should not redirect. Appreciate any help on this matter. Thank you.

javascriptwordpressbookmarklet

Answer №1

To prevent the default behavior of the href link, make sure to add this.stop; at the end of your code. Additionally, use a.innerHTML instead of trying to use the value attribute on a div element stored in variable a.

<a href="javascript:var t=document.querySelectorAll('div.media-sidebar label input');var a=t[2];var u=document.querySelectorAll('div.media-sidebar textarea');var b=u[0];var v=document.querySelectorAll('div.media-sidebar label input');var c=u[1];a.innerHTML='Hello';this.stop;">Duplicate</a>

By adding this.stop;, you will successfully prevent the page from redirecting when the link is clicked.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Most effective method to avoid updating a node_modules package

tag: After downloading and installing a node_module (npm package)... I have customized the internal files within the node_modules folder to better fit my requirements. Although using it as a node_module is most convenient for me, I am concerned that futur ...

javascriptnpmnode-modulesnpm-install

Tips for initiating a function at a designated scroll point on a webpage

Currently, I am testing out a code snippet that allows images to flip through in a canvas element. I'm curious if it's possible to delay the image flipping effect until the viewer scrolls down to a specific section of the page where the canvas i ...

javascripthtmljquerycanvashtml5-canvas

Leveraging JavaScript Functions in HTML

I am having an issue with a JavaScript file containing two similar functions that are executed through an HTML form. While the first function runs smoothly, the second function does not display correctly. It seems like I might be calling or executing the ...

javascripthtmlangularjs

Issue with setting headers in Express.js when using an exported function

Exploring testing methods with Express using Mocha, Chai, Chai-HTTP plugin, and MongoDB with Mongoose. One particular test is designed to check if MongoDB correctly handles errors when attempting to retrieve a document with a faulty _id value (too short). ...

javascriptnode.jsexpressmongoosemocha.js

Utilizing URL Parameters and Query Strings in React Router: A Comprehensive Guide

Can someone help me retrieve the foo parameter value from http://localhost:3000/params?foo=123? I keep encountering an error message: Error: Params(...): No render output was returned. This typically indicates a missing return statement or returning null ...

javascriptnode.jsreactjsnext.jschakra-ui

Are there any JavaScript alternatives to Python's pass statement that simply performs no action?

Can anyone help me find a JavaScript alternative to the Python: pass statement that does not implement the function of the ... notation? Is there a similar feature in JavaScript? ...

javascriptpythonfunctionlexical

What is the best way to switch between components in vue.js?

I have created a Dashboard.vue component consisting of two child components: DisplayBooks.vue and sortBooksLowtoHigh.vue. Initially, the sortBooksLowToHigh component is hidden while the displayBooks component is visible by default. The requirement is that ...

javascriptvue.jsvuejs2

The Google Language Translator disregards the formatting

Currently, I am in the midst of developing a website with Wordpress and have successfully integrated Google Language Translator. Everything seems to be working well, except for one issue - when I translate the content, it alters the font size. Prior to tra ...

htmlcsswordpress

troubles arise when using undeclared functions in javascript

Recently, I've been working on implementing a Javascript CountDown Timer triggered by a button click. The Javascript code is stored in an external file, as well as the CSS for styling the timer. The problem arose when I tried including the Javascript ...

javascripthtmlasp.netvb.netcountdowntimer

What could be causing the ReferenceError when the Response object is not defined?

I am currently working on node.js and express. After attempting to establish a simple server, I am encountering an unexpected response error. const http = require('http'); const myServer = http.createServer(function(req, res){ res.writeHead ...

javascriptnode.jsexpress

How can Components access variables declared in a custom Vue.js plugin?

I had developed a unique Vue js plugin to manage global variables as shown below: CustomConstants.js file: import Vue from 'vue' export default { install(Vue){ Vue.CustomConstants = { APP_VERSION: '2.1.0' ...

javascriptvue.js

Is there a way to manually add a function to the Javascript/Nodejs event queue?

Suppose I want to achieve the following: function doA(callback) { console.log("Do A") callback() } function doB() { console.log("Do B") } function doC() { console.log("Do C") } doA(doC) doB() I expect the output to be: Do A Do B Do C However ...

javascriptnode.js

Is there a way to associate a click event with an angular2 template interpolation?

Can a click event be bound to an interpolation? Whenever I try to run the code below, I encounter the following ERROR Error: Uncaught (in promise): Error: Template parse errors: Parser Error: Got interpolation ({{}}) where expression was expected at col ...

javascriptangular

In Vue, you can dynamically load a JavaScript file containing a JavaScript object during runtime

I'm in the process of developing a no-code application with Vue. I have come across an issue where I cannot add functions to a JSON file that I want to import at runtime. As a workaround, I decided to use a JavaScript or TypeScript file to store the J ...

javascripttypescriptvue.js

Verify the accuracy of the properties received from mapStateToProps in a functional React Redux component

I am working with 3 components: TypeList, ConnectedType (connected through connect(mapStateToProps)(Type)), and the component Type. Type will receive props from both TypeList (onClick, name) passing props to ConnectedType as well as ConnectedType's ma ...

javascriptreactjsreduxreact-redux

Analyzing a text file against a string to identify discrepancies using Node.js

Recently, I came across a dilemma involving a text file containing information on all Wifi connections (such as ssid, mac no, strength, etc.) that were within my laptop's range just 2 minutes ago. Now, I've rerun the code and obtained the current ...

javascriptarraysnode.js

Link rows to dictionary keys and show their corresponding values

In my React component, I have a list of dictionaries stored in the props as follows: console.log(fruits): [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…} ] The dictionary entries are: 0: name: 'Apple' color: 'Red&apos ...

javascriptreactjs

Shaky parallax movement

I recently created a website with a parallax effect, but I'm experiencing some performance issues with jittery movement. The page uses CSS3 transform scale to zoom in and out, and automatically resizes on page resize with JavaScript/jQuery. For the ...

javascriptjquerycss

How to display a name in an iframe using React

When I retrieve the movie name in React, it appears correctly as {movie.name} / {movie.enname} ({years}) . However, when I try to display this name within an iframe window at https://example.com/movie/{movie.name}, it does not show up properly. Here is th ...

javascriptreactjsiframereact-redux

When attempting to run `npm install`, an error message is received indicating a network connectivity issue: "npm ERR

When I try to run npm install, I encounter an error. Here is the error message: 71 error code ETIMEDOUT 72 error errno ETIMEDOUT 73 error network request to https://registry.npmjs.org/@angular%2fanimations failed, reason: connect ETIMEDOUT 151.101.112.16 ...

javascriptangularjsnode.js