首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >通过替换替代文本来调整单击插入

通过替换替代文本来调整单击插入
EN

Stack Overflow用户
提问于 2012-06-05 02:14:16
回答 1查看 111关注 0票数 0

我正在尝试修改这个脚本:jQuery Example: Inserting text with drag n’ drop

我的目标是让我的用户点击一个图像缩略图,并将适当的标记图像代码插入到文本区域中。

我不熟悉JS,所以我知道脚本的要点发生在这里:

代码语言:javascript
运行
AI代码解释
复制
$('#ClickWordList li').click(function() {
    $("#txtMessage").insertAtCaret($(this).text());
        return false
    });

具体地说,.text()就在那里,但是我不知道如何修改输出,以满足我需要插入的标记片段,而不仅仅是列表文本。

Markdown内联图像语法如下所示:![Alt text](/path/to/img.jpg)

我尝试将列表更改为包含图像的div,然后更改为.insertAtCaret($(this).src);,但插入文本显示为"undefined“。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-06-05 02:24:32

$(this).src未定义,因为$(this)是一个jQuery object,而jQuery对象没有src属性。假设您的选择器中有一个图像元素,您可以尝试:

代码语言:javascript
运行
AI代码解释
复制
$("#txtMessage").insertAtCaret($(this).attr('src'));

当只给出一个参数时,.attr() jQuery方法将返回匹配元素的给定属性的值。

代码语言:javascript
运行
AI代码解释
复制
$("#txtMessage").insertAtCaret($(this)[0].src);

来获取文字DOM元素的src

额外的解释(如果你需要)

如果没有提供任何参数,.text() jQuery方法将返回this引用的元素(即事件的目标)中的所有文本,在本例中,返回的是在#ClickWordList元素中单击的li

.insertAtCaret()drag 'n drop插件提供的jQuery对象的扩展函数。

return false将照它所说的做,在所选元素的click事件处理程序中返回false,这将简单地取消事件并防止其传播进一步冒泡到DOM上。

如果有任何打字错误,很抱歉。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/10890727

复制
相关文章
vue组件引入时候报错
报错如下: “ Unknown custom element: <XXX> - did you register the component correctly? For recursive comp
安德玛
2022/03/06
5200
父组件向子组件传递一个组件
leader755
2023/07/31
1420
在Vue组件中使用多个Vue组件搭建一个页面
是在main.js中,通过import和Vue.conponent进行组件注册的。
Swingz
2020/12/18
2.7K0
在Vue组件中使用多个Vue组件搭建一个页面
每个程序员都有一个故事
上周在公众号做了一个送书活动,鼓励大家在文末分享自己的故事,其中有很多朋友的分享很有故事,看了大家的留言真心感觉每个程序员一路走来都不容易,也许他的故事会对你我有所启发,今天将这些故事整理分享给大家。
纯洁的微笑
2018/12/12
5010
VUE开发一个组件——Vue 分页组件
想要快速开始的,请向下看。如果想理解源码的,可以直接跳过“快速开始”, 到“源码解读”
Javanx
2019/09/04
6450
VUE开发一个组件——Vue 分页组件
在一个组件中使用多个useEffect钩子
在一个组件中使用多个useEffect钩子。React Hooks允许在组件中使用任意数量的useEffect钩子来处理不同的副作用操作或监听不同的触发时机。
王小婷
2023/09/17
9050
关于 defineAsyncComponent 延迟加载组件 在 vue3 中的使用总结
使用 vue 3 的 defineAsyncComponent 特性可以让我们延迟加载组件。这意味着它们仅在需要时从服务器加载。
前端达人
2021/09/08
6.7K0
vue要求组件模板只有一个根元素的原因
Vue其实并不知道哪一个才是我们的入口,因为对于一个入口来讲,这个入口就是一个‘Vue类',Vue需要把这个入口里面的所有东西拿来渲染,处理,最后再重新插入到dom中。
江一铭
2022/06/16
5680
如何制作一个组件?论组件化思想
现今的web开发通过前后端分离的技术拆分为了web后端开发与web前端开发,值得指出的是,web前端开发早已不是传统意义上的开发模式了,转而变成了web客户端开发,有过客户端开发经验的同学应该知道这两者间的差别,客户端开发关注的是:
coder_koala
2020/11/10
7730
如何制作一个组件?论组件化思想
在 Vue 中,父组件中传递数据给子组件
在父组件中传递数据给子组件。在 Vue 中,可以通过 props 属性来实现父组件向子组件传递数据的功能。
王小婷
2023/09/11
3460
Taro中的一个父组件中map渲染子组件列表的时候,问题
我们在开发的时候,组件和页面一定要分开,如果是组件的话,就一定不要当成页面组件在pages中配置,就拿列表组件来说
耙耳朵
2020/06/11
2K0
封装一个开关组件
前言 在我们日常项目开发中,我们经常会做一些功能的开关控制,所以封装了这款开关组件。 开关组件 属性 1. value 是否打开 值为布尔类型 默认为:false 2. disabled 是否不可用 值为布尔类型 默认为:false 3. showText 是否显示字,“开”或者“关” 值为布尔类型 默认为:true 事件 1. change 值改变事件 参数:value 是否打开(值为布尔类型) 示例 template: <div class="switch-list"> <div class
玖柒的小窝
2021/10/19
6120
组件分享之后端组件——一个基于Golang的ORC组件包
近期正在探索前端、后端、系统端各类常用组件与工具,对其一些常见的组件进行再次整理一下,形成标准化组件专题,后续该专题将包含各类语言中的一些常用组件。欢迎大家进行持续关注。
cn華少
2022/04/02
1.5K0
封装一个vue组件
输入vue init webpack-simple &lt;project-name>之后,一路回车就是了(sass可以根据自己爱好选择),然后根据出现的提示依次执行切换目录,下载依赖。
yutingbai
2022/08/18
5910
封装一个vue组件
Vue组件中data必须是一个函数
Vue组件中data属性不能为对象原因是对象是引用类型,组件会被多个实例同时引用导致的结果就是多个实例共享一个对象,其中一个组件改变了data对象中的值,其他实例也会受到影响。
用户10275458
2022/12/21
3250
Vue组件中data必须是一个函数
Postgresql 安全组件都有那些
postgresql 安全的组件有不少,到底有那些都起到什么作用,可以在这里说一说.安全的组件,主要有以下几个方面, 1密码攻击方面的安全保护 2 审计方面的记录 3 密码方面的等级的保护, 以下截图均从 POSTGRESQL 12.2 版本来进行
AustinDatabases
2021/05/11
1.3K0
Postgresql  安全组件都有那些
Discourse 如何安装一个主题组件或者主题组件
如何在 discourse 中安装一个主题(Theme)或者主题组件(Theme Component)
HoneyMoose
2020/05/21
7730
Discourse 如何安装一个主题组件或者主题组件
vue实现一个弹窗组件_vue弹窗组件封装
最近新项目遇到一个需求,在输入错误的时候,使用toast弹窗提示,在此之前,我使用的弹窗都是只写在单个页面上,需要的时候写一个,虽然也可以,但是对这个项目来说就太过麻烦了,于是想要写一个toast弹窗组件,在全局中引用。 参考了从零开始徒手撸一个vue的toast弹窗组件这篇博文,我写了一个自己的弹窗组件。
全栈程序员站长
2022/11/09
1.7K0
vue实现一个弹窗组件_vue弹窗组件封装
Kubernetes组件:一个典型应用中的资源
Kubernetes是希腊文,意思是“舵手”,寓意是能带领我们安全地到达未知水域。Kubernetes这样的容器编排系统,会帮助我们妥善地管理分布式应用的部署结构和线上流量,高效地组织容器和服务。Kubernetes 作为数据中心操作系统,在设计软件系统时,能够尽量降低在底层网络和硬件设施上的负担。
用户1682855
2019/03/06
7840
Kubernetes组件:一个典型应用中的资源
Vue组件中data必须是一个函数
Vue组件中data属性不能为对象原因是对象是引用类型,组件会被多个实例同时引用导致的结果就是多个实例共享一个对象,其中一个组件改变了data对象中的值,其他实例也会受到影响。
peng_tianyu
2022/12/15
2780
Vue组件中data必须是一个函数

相似问题

使用C#的SimpleITK读取原始图像文件

29

尝试打开C#交互式窗口时出错

14

使用Retrofit2.0上传图像时出错

10

SimpleItk裁剪图像

2143

在Python中使用SimpleITK读取mhd文件时出错

2100
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文