js 判断 id 改变 input 中 value 的部分内容，怎么弄啊。

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

推荐关注

› Meteor

› JSLint - a JavaScript code quality tool

› jsFiddle

› D3.js

› WebStorm

推荐书目

› JavaScript 权威指南第 5 版

› Closure: The Definitive Guide

这是一个创建于 748 天前的主题，其中的信息可能已经有所发展或是发生改变。

比如

<input class="text-input" type="text" id="image-link3" value="https://i.xxx.com/Rg1xQrV.png" data-focus="select-all" readonly="">

https://i.xxx.com/Rg1xQrV.png

替换成 https://a.aaa.net/Rg1xQrV.png

19 条回复 • 2022-12-10 14:47:17 +08:00

summerwar

2022-12-10 09:09:15 +08:00

如果是提交的表单，你重写 submit ，在里面替换

如果是展示的，在模板里写 replace 就好了

不需要用 js

summerwar

2022-12-10 09:09:40 +08:00

需要用 js ，但是不需要用 js 判断 id 来改变 input 中的 value

molvqingtai

2022-12-10 09:12:27 +08:00 via Android

const input = document.querySelector("image-link3")

if input.value === xxx
input.value = aaa

手机不好打，大概这样子

SkyRing

2022-12-10 09:26:42 +08:00

@molvqingtai 我试试看

SkyRing

2022-12-10 09:31:22 +08:00

![07d9f0c7d958fbe98e2bd43cfbcb888a.png]( https://pic1.rpgsky.net/imgcn/moepic/2022/12/10/07d9f0c7d958fbe98e2bd43cfbcb888a.png)
感觉似乎并无软用啊

SkyRing

2022-12-10 09:34:19 +08:00

xlsama

2022-12-10 09:34:58 +08:00

const el = document.querySelector('#image-link3');

setTimeout(() => {
el.setAttribute('id', 'xxx');
}, 2000);

const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.type === 'attributes') {
console.log('attributes changed');
el.setAttribute('value', 'https://a.aaa.net/Rg1xQrV.png');
}
});
});

observer.observe(el, {
attributeFilter: ['id'],
});

SkyRing

2022-12-10 09:36:01 +08:00

@summerwar 不判断的话，那岂不是，都变了？

SkyRing

2022-12-10 09:38:00 +08:00

@xlsama 大佬您好，变动的只有 a.aaa.net 就可以了，你这整个全改了诶~

tonyrft

2022-12-10 09:41:43 +08:00

嗯，您想要只更改 URL 的一部分而不是整个 URL ，这是可以实现的。您可以使用 JavaScript 的 String.replace() 方法来执行替换操作，该方法允许您指定要替换的字符串和替换为的字符串。

例如，您可以使用以下代码来执行替换操作：

var inputElement = document.getElementById('image-link3');
inputElement.value = inputElement.value.replace('https://i.xxx.com', 'https://a.aaa.net');

请注意，我们在上面的代码中使用了两个参数的 replace() 方法，第一个参数是要替换的字符串（即 'https://i.xxx.com'），第二个参数是替换为的字符串（即 'https://a.aaa.net'）。

如果您需要在页面加载完成后执行此操作，可以将上述代码放在 window.onload 或 document.ready 事件的回调函数中，如前面所述。

希望这些信息对您有帮助。

xlsama

2022-12-10 09:53:31 +08:00

@SkyRing
s.replace(/http(s):\/\/(.*)\//,'https://a.aaa.net/')

xlsama

2022-12-10 09:55:11 +08:00

el.setAttribute('value', el.value.replace(/http(s):\/\/(.*)\//, 'https://a.aaa.net/'));

SkyRing

2022-12-10 11:07:17 +08:00

@tonyrft 感谢大佬，非常有用，不过又遇到了个新问题，

就是这个，他的第二个地址没办法替换，因为只能获取到地址，前面的名称获取问题也没法解决。