使用JS 按钮onclick传递url参数

Posted 2023-04-12

编写一个JS 点击选项 获取数值 使./template/0/0/0/0/0.aspx地址 能获取两个参数 变成./template/1/0/blue/0/0.aspx 从而进行页面跳转。

参考技术A 按钮onclick调用方法

方法：
var d_url=document.location.href;//d_url='./template/0/0/0/0/0.aspx'
//截取字符串拼接等等方法，替换成./template/1/0/blue/0/0.aspx
window.location.href=新的地址;跳转~~~追问

参数是动态的,

追答

动态的不一样么~~~就是个参数传递啊~~~静态的能传，改成动态的参数不就得了~~~至于怎么获取动态的，不知道你那什么情况~~~是后台获取还是获取页面表单填写参数等等

本回答被提问者采纳

将值作为参数传递 onClick 函数

【中文标题】将值作为参数传递 onClick 函数

【英文标题】：Passing a value as parameter onClick function

【发布时间】：2018-01-11 05:19:15

【问题描述】：

我从学习 React JS 开始，一直坚持将参数（例如按钮 id 或 Tab 值等）传递给 Tab onClick 事件。我得到的结果从“未定义”（将属性名称作为参数传递时）不等。 注意：Tag 是 material-ui 库的一个组件。

constructor(props)
    super(props);
    this.state =  value : 'a';
    this.handleChange = this.handleChange.bind(this);


handleChange(event)
    console.log(event.target.value);    //it prints undefined
    this.setState(value: event.target.value);


<Tabs value=this.state.value>

    <Tab label="Tab A" value="a" onClick=this.handleChange>
      <div>
        <h2>Controllable Tab A</h2>
        <p>TAB A
        </p>
      </div>
    </Tab>

    <Tab label="Tab B" value="b" onClick=this.handleChange>
      <div>
        <h2>Controllable Tab B</h2>
        <p>TAB B</p>
      </div>
    </Tab>
</Tabs>

我尝试创建一个选项卡菜单，但我无法将 Tab 的值传递给 handleChange 函数。我的目标是，如果用户单击选项卡 A，this.state 的值应更新为“a”，否则该值应为“b”。

我该怎么做？

谢谢。

【问题讨论】：

对不起。 **Tab 是 material-ui 库的一个组件。

onClick=() => this.handleChange('b') 有效。

【参考方案1】：

经过进一步检查，我发现了问题 - 你可能没有注入 react-tab-event-plugin，因为 material-ui 需要它来触发任何 onClick、onChange 等事件。此外，您的 render 对于 material-ui 示例似乎不正确。

所以，例如，在您的 App.js comp. 中，您应该像这样注入它：

import injectTapEventPlugin from 'react-tap-event-plugin';
injectTapEventPlugin();

这个组件非常适合我：

state = 
   activeTab: 'a'
;

handleChange = (activeTab) => 
    this.setState( activeTab);
;

render = () => (
    <Tabs
        value=this.state.activeTab
        onChange=this.handleChange
    >
        <Tab label="Tab A" value="a">
            <div>
                <h2>Controllable Tab A</h2>
                <p>
                    Tabs are also controllable if you want to programmatically pass them their values.
                    This allows for more functionality in Tabs such as not
                    having any Tab selected or assigning them different values.
                </p>
            </div>
        </Tab>
        <Tab label="Tab B" value="b">
            <div>
                <h2>Controllable Tab B</h2>
                <p>
                    This is another example of a controllable tab. Remember, if you
                    use controllable Tabs, you need to give all of your tabs values or else
                    you wont be able to select them.
                </p>
            </div>
        </Tab>
    </Tabs>
);

【讨论】：

对不起，我把代码改了写了，但我忘了把字母A去掉。不幸的是，这不是问题，是别的问题..

我更新了答案并解释了问题。希望它现在对你有帮助:)

【参考方案2】：

嘿嘿， 在这种情况下，您可以使用 refs 或者您可以使用 this.handleChange.bind(this, "value") 传递值