首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

按钮href正在忽略问号后面的所有内容

按钮href属性用于指定按钮点击后跳转的链接地址。当链接地址中包含问号(?)时,浏览器会将问号后面的内容解析为查询字符串,用于传递参数或者其他信息。然而,有时候我们希望按钮点击后只跳转到指定的页面,而忽略问号后面的内容。

为了实现这个需求,可以使用JavaScript来处理按钮的点击事件。具体的实现方式如下:

  1. 给按钮添加一个唯一的id属性,例如id="myButton"。
  2. 使用JavaScript获取按钮元素,并为其添加点击事件监听器。
  3. 在点击事件处理函数中,使用window.location.href获取当前页面的URL,并使用indexOf方法查找问号的位置。
  4. 如果找到问号,则使用substring方法截取问号前面的部分作为新的URL,并使用window.location.href将页面跳转到新的URL。

以下是一个示例代码:

代码语言:txt
复制
<button id="myButton">点击跳转</button>

<script>
  var button = document.getElementById("myButton");
  button.addEventListener("click", function() {
    var currentUrl = window.location.href;
    var questionMarkIndex = currentUrl.indexOf("?");
    if (questionMarkIndex !== -1) {
      var newUrl = currentUrl.substring(0, questionMarkIndex);
      window.location.href = newUrl;
    }
  });
</script>

这样,当按钮被点击时,浏览器会跳转到当前页面URL中问号前面的部分,忽略问号后面的内容。

请注意,以上代码只是一个示例,实际应用中可能需要根据具体情况进行适当的修改和调整。

关于按钮href属性的更多信息,您可以参考腾讯云文档中的相关内容:按钮href属性

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

【微服务】168:搜索的前端页面分析

学习计划安排,搜索相关的前端页面分析: 页面的头部栏。 搜索页面获取请求参数。 浏览器上做个简单的js代码测试。 至于发送请求和后台代码留待明天完成。...①找到搜索框 搜索框绑定了一个点击事件,点击搜索按钮时会调用search方法。 ②search方法 跳转search.html页面,同时携带参数key,这个key也就是在搜索框中输入的内容。...那时主要是学习了location中href这个属性,也就是页面对应的url。 事实上除了href还有其它很多属性,在搜索中需要使用到search属性,也就是拼接的参数。...但是其值包含有一个问号,所以要通过substring(1)将问号截取掉。 同时要通过parse方法将字符串转换成json对象,这是自定义组件中的一个方法,文章最后会做一个简单的说明。...最后 行有不得反求诸己,我是@刘小爱 一个白天上班晚上学习的95沪漂,不为其它,只为学会自律做好自己,也愿我的每日打卡能给你带来勇气,欢迎点赞关注和评论。

1.4K30

瞒不住了,Prefetch 就是一个大谎言

下面这段代码中,假设你将代码放在惰性加载块后面的 Buy 按钮后面,看起来像这样:export default () => { return ( -...一些移动浏览器忽略 prefetch,因为移动浏览器认为这是在移动网络上,并试图节省带宽。在闲置的时候加载因此,大多数浏览器只在 network 空闲时才处理 prefetch。...如果等到页面上的所有东西都加载才开始获取JavaScript,通常为时已晚。你可以想象一个网站向你展示照片的时候。如果照片很大,需要下载一段时间。但你想在所有照片下载之前就开始与网站互动。...现在,对同一资源的两个请求正在运行。更糟糕的是,原始资源被解析,buy.js 被插入到浏览器缓存中,但是资源的解析并没有解除用户交互的阻塞。

71300
  • 瞒不住了,Prefetch 就是一个大谎言

    下面这段代码中,假设你将代码放在惰性加载块后面的 Buy 按钮后面,看起来像这样: export default () => { return ( <button onClick...-- 或选择一个可替代的策略 ...一些移动浏览器忽略 prefetch,因为移动浏览器认为这是在移动网络上,并试图节省带宽。 在闲置的时候加载 因此,大多数浏览器只在 network 空闲时才处理 prefetch。...如果等到页面上的所有东西都加载才开始获取JavaScript,通常为时已晚。 你可以想象一个网站向你展示照片的时候。如果照片很大,需要下载一段时间。但你想在所有照片下载之前就开始与网站互动。...现在,对同一资源的两个请求正在运行。 更糟糕的是,原始资源被解析,buy.js 被插入到浏览器缓存中,但是资源的解析并没有解除用户交互的阻塞。

    33920

    跳转与导航 | Electron 安全

    成功输出 URL 对象,其中完整内容为 URL { href: 'https://www.baidu.com/robots.txt', origin: 'https://www.baidu.com...的src 修改不会触发主进程的跳转与导航事件 iframe 加载的内容中通过 window.top.location 修改顶层窗口的 URL 5 秒 触发导航事件 5. window.location...返回当前页面的完整URL字符串,也可以用来设置新的URL以导航到其他页面 window.location.href = "https://www.baidu.com/" 5秒 触发导航事件 2)...重新加载当前页面 window.location.reload(); 5秒 触发导航事件 4) location.replace 替换当前页面的 URL window.location.replace..." 5 秒 6) 其他属性 属性较多,基本上都是 URL 的一部分,如果修改也会导航事件 href: 返回当前页面的完整URL字符串,也可以用来设置新的URL以导航到其他页面。

    25110

    JavaScript 高级程序设计(第 4 版)- BOM

    忽略第三个参数 window.open()返回一个对新建窗口的引用,可以以此控制新窗口 可以用close()关闭新打开的窗口 新建窗口的window对象有一个属性opener,指向打开它的窗口 窗口不会跟踪记录自己打开的新窗口...q=javascript#contents 当前加载页面的完整URL。...q=javascript URL的查询字符串,该字符串以问号开头 location.username foouser 域名前指定的用户名 location.password barpassword 域名前指定的密码...URL 即使 location.href 返回的是地址栏中的内容,浏览器页不会向服务器发送请求 第一个参数应该包含正确初始化页面状态所必需的信息。...否则,单击“刷新”按钮会导致 404 错误。所有单页应用程序( SPA, Single Page Application)框架都必须通过服务器或客户端的某些配置解决这个问题。

    1.2K10

    第189天:BOM属性方法

    ); replace和assign的区别  replace()方法所做的操作与assign()方法一样,  但它多了一步操作,即从浏览器的历史记录中删除了包含脚本的页面,  这样就不能通过浏览器的后退按钮和前进按钮来访问它了..., assign()方法却可以通过后退按钮来访问上个页面。...location.reload(); //从浏览器缓存中重载当前页面 6 } 3、其他属性 (1) hash:如果URL中包含有“#”,该方法将返回该符号之后的内容...(3) hostname:通常等于host,有时会省略前面的www。 (4) href:当前页面载入的完整URL。 (5) pathname:URL中主机名之后的部分。...(9)search:执行GET请求的URL中的问号?的部分,又称查询字符串。 // 例如http://www.leledeng.com/search.html?

    33540

    VB语言基础重要知识点03

    按钮图标形如一个小方块:按钮可以用作点击事件,让我们点击产生需要的功能。 ? 提问:默认在图形界面上双击控件默认是单击事件的控件有哪些?...使用方法:msgbox "文本内容"。 用法2:使用两个参数,第二个参数是消息框类型选择,第二个参数默认也可以省略,省略情况下只有一个确定按钮,注意省略的情况下也要注意加逗号留下空位。...vbCritical:是一个X的符号 vbAbortRetryIgnore:选择框,用于选择中止、重试、忽略 vbInformation:类似蓝色感叹号 vbOKCancel:确定和取消 选择框 vbOKOnly...:只有确定按钮 vbQuestion:问号按钮 vbRetryCancel:重试和取消按钮 vbYesNo:是和否的选择框 vbYesNoCancel:是、否、取消 三项选择 用法3:使用三个参数,第三个参数是消息框的标题...title 补充:所有在写代码的时候出现的符号必须是英文状态下且半角状态的代码。

    1.1K10

    HTML中css和js链接版本号的用途

    更改css文件名 其实解决这个问题很简单,缓存是通过文件名(例如:style.css,style.min.css,style.min.v2.css等)标记缓存内容的。...在你更新了网站的css文件内容,在更换一下css的文件名就可以了。...后面的内容)就可以了,由浏览器自动去比较css,js链接后面的版本号大小,来自动更新客户端最新的css,js等静态文件。...ver=1.0.1”type=”text/css” media=”screen”/> 总结 其实css,js文件后面的问号不起实际作用,仅能当作后缀,让浏览器自动检测更新最新的css,js等静态文件。...如果用问号加参数的方法,可以添加版本号等信息,同时可以刷新一下浏览器端的缓存。一个小小的细节,可以给我们带来很大的方便。 示例请见我的博客: IT-Homer 博客 或 IT-Homer 河马代理

    5.6K50

    Browser 对象所有属性和方法介绍,看这一篇就够了!

    confirm() 显示带有一段消息以及确认按钮和取消按钮的对话框。 createPopup() 创建一个 pop-up 窗口。 focus() 把键盘焦点给予一个窗口。...scrollBy() 按照指定的像素值来滚动内容。 scrollTo() 把内容滚动到指定的坐标。 setInterval() 按照指定的周期(以毫秒计)来调用函数或计算表达式。...setTimeout() 在指定的毫秒数调用函数或计算表达式。 Window 对象描述 Window 对象表示一个浏览器窗口或一个框架。...Navigator 对象描述 Navigator 对象包含的属性描述了正在使用的浏览器。可以使用这些属性进行平台专用的配置。...search 设置或返回从问号 (?) 开始的 URL(查询部分)。 方法 属性 描述 assign() 加载新的文档。 reload() 重新加载当前文档。

    80730

    为什么网站中的CSS或JS会带有v或version参数

    大家有时候会发现修改了CSS样式或者JS文件,刷新页面的时候不变,是因为客户端缓存了 CSS 或者 JS 文件,导致修改不省心,这时候清一下缓存或者强制刷新一下就好了,因此加上参数还是有一定好处的!...一个网站的访客成千上万,你不可能在更新 CSS 让每个访客都刷新一下缓存,那么这个问题你会怎么处理呢? 方法一:更改CSS文件名 其实解决这个问题很简单,缓存是通过文件名标记缓存的内容的。...="index.css" /> 另外一种更改CSS文件名的方法是将版本号写到文件名中,如: CSS 文件更新...,改一下文件名中的版本号即可: 方法二:给CSS文件添加版本号 每次修改 CSS 文件还要修改文件名确实有点麻烦...总结: 其实CSS文件后面的问号起不到实际作用,仅能当作后缀,如果用问号加参数的方法,可以添加版本号等信息,同时可以刷新一下浏览器端的缓存。一个小小的细节,可以给我们带来很大的方便。

    4.2K10

    JavaScript(九)

    第二个参数是一个表示等待多长时间的毫秒数,但经过该时间指定的代码不一定会执行。 JavaScript 是一个单线程序的解释器,因此一定时间内只能执行一段代码。...提示框中除了显示 OK 和 Cancel 按钮之外,还会显示一个文本输入域,以供用户在其中输入内容。...开头 查询字符串参数 尽管 location.search 返回从问号到 URL 末尾的所有内容,但却没有办法逐个访问其中的每个查询字符串参数。...为此,可以像下面这样创建一个函数,用以解析查询字符串,然后返回包含所有参数的一个对象: function getQueryStringArgs() { //取得查询字符串并去掉开头的问号.../1ess"; location.href = "https://github.com/1ess"; 在这些改变浏览器位置的方法中,最常用的是设置 location.href 属性。

    1.1K40

    window对象(一) 计时器 定位导航 url解析 浏览历史 对话框 消息推送

    否则使用"" * */ function urlArgs() { var args = {}; var query = location.search.substring(1); // 获得问号面的内容...,所以返回=前面的内容 var value = pairs[i].substring(pos+1); // 返回等号的结果 args[name] = value; // 对键值对进行存储...// 单击浏览器的后退按钮2次、 history.go(-2) // 单击浏览器的前进按钮2次 history.go(2); 由于ajax的技术的存在,导致会发生这种事情。...以后这也是需要弥补的一个地方、 alert confirm prompt alert 只有一个确定按钮,用于警告等内容 confirm 一个可选的消息,以及两个按钮,在浏览器的地址栏正中央的下方弹出,chromer...即,在用户关掉的之前,不会返回内容,即意味着在弹出一个对话框前,代码会停止运行。如果正在载入文档,会停止载入,等待用户输入。

    68640

    最新jquery+easyui_api培训文档

    fn(b):当用户点击按钮触发的回调函数,如果点击OK则给回调函数传true,如果点击cancel则传false。...fn(val):用户点击按钮的回调函,参数是用户输入的内容。 5.3 扩展 可以通过$.messager.defaults方法自定义alert框的ok按钮和cancel按钮上显示的文字。...在输入框组件显示的标签 Of  {pages} displayMsg 字符串 显示一个页面的信息。...pageSize: 新页面的大小 onBeforeRefresh ageNumber, pageSize 刷新按钮被点击之前触发,如果返回false则取消刷新操作 onRefresh ageNumber...href 字符串 填充标签内容的远程URL地址 null cache 布尔 如果为true,当设置href时,对标签面板进行缓存 true icon 字符串 标签面板上标题的图标CSS类 null

    3.2K40

    数据获取:​网页解析之lxml

    “/a”表示在上面的对象结果的子节点中选择a标签的节点。“/@href”表示选择的a标签中的href属性的值,同样,如果想要获取“title”标签中的内容,就是直接是@ title。...'] “//div//a/@href”表示的是,在所有的div下的所有子孙节点中的a标签的href属性值。...在上面的HTML文本中,div下一级标签其实是ul,但是XPath中“//”是选择的下面所有节点。所以是可以找到我们想要的结果。...以豆瓣电影网页为例子,首先在浏览器中打开F12的开发者工具,tab选中【查看器】,如下图所示: 然后选中页面元素选择按钮,选中正在热映的电影的div。...点击此按钮按钮会变为蓝色,当鼠标移动到页面时,页面会显示元素的标签和大小,并且光标所在的位置,页面会变成蓝色,如图所示,在查看器中的也会相应显示当前光标位置所在位置的代码。

    28710

    java学习与应用(4.2)--JavaScript、bootstrap

    ,等同其他问号冒号表达式 JS特殊语法:语句分号结尾,一行一条语句可以省略(不建议)。var定义时可省略,使用时为局部变量,不使用var声明为全局变量(不建议)。...innerHTML属性修改标签体内容。 事件:某些组件执行触发执行的代码,标签上添加事件onclick属性点击执行js(也可以在js中获取标签对象,然后添加onclick事件)。...值进行自动转到,可能影响js执行效果,可以使用href中添加JavaScript:void(0)消除) HTML DOM HTML DOM:对标签体内容的获取,设置,追加使用innerHTML属性,更方便修改和控制...HTML内容。...组件:导航条navbar-xxx,汉堡按钮和平铺导航的设置,阅读代码,修改和移植。翻转导航条(反色等)。

    2.2K10

    【CSS】课程网站 网格商品展示 模块制作 ① ( 网格商品展示模块盒子模型测量及样式 | 顶部文本标题盒子测量及样式 | 代码示例 )

    需要行高 = 内容高度 , 这里精确的测量 " 精品推荐 " 文本的行高与内容高度 ; 该文本盒子如下图所示 , 文本内容 20 像素 , 文本上面和下面各有 20 像素的空白 ; 行高直接设置为 60...-- 底部的 全部课程 按钮 --> 全部课程 <!...) */ li { list-style: none; } /* 清除所有链接的下划线样式 */ a { text-decoration: none; } /* 清除按钮默认样式 ( 主要是按钮自带的边框...*/ .search button { /* 设置左浮动 使其与表单在同一行显示 */ float: left; /* 按钮宽度 50 像素 */ width: 50px; /* 按钮高度.../* 文字大小 16 像素 */ font-size: 16px; /* 设置文字颜色 */ color: #00a4ff; } /* 设置 竖线和课程名称所在盒子 的文本颜色 这是所有的文本样式

    4.3K40
    领券