为了账号安全,请及时绑定邮箱和手机立即绑定

如何使用html中的href传递输入字段值?

如何使用html中的href传递输入字段值?

qq_花开花谢_0 2023-12-14 16:40:54
我想将一个整数值从 href 传递到输入字段值。假设 example.com 是有 1 个输入字段的网页。我想做类似href="www.example.com" value="12345" 点击这里 1href="www.example.com" value="125"点击这里 2如果用户点击这里 1然后输入字段在 example.com 中必须填写 12345 值,如果用户单击“单击此处 2”,则 example.com 中的输入字段必须填写 125 值。(用户无需输入该值)
查看完整描述

4 回答

?
富国沪深

TA贡献1790条经验 获得超9个赞

好吧,根据我的理解,这就是你想要做的 - 你有两个链接

链接1 - 点我!链接 2-不,请点击我!

如果用户单击链接 1,他们将看到一个包含值的输入字段。输入的值将是链接的值。如果单击链接 2,将向他们显示一个包含链接二值的输入字段。

实现这一点相当简单,只需设置一个简单的 javascript 函数,该函数在单击每个链接时就会发生。

例如 const linkOne = document.querySelector('.linkOne'); const inputOne = document.querySelector('.inputOne'); linkOne.addEventListener("click", function() { inputOne.value = linkOne.getAttribute('value'); }); ,然后您将对链接二执行相同的操作。

getAttribute 可以帮助您获取元素的任何属性,我们不会使用 .value 因为这会返回链接。


查看完整回答
反对 回复 2023-12-14
?
慕森王

TA贡献1777条经验 获得超3个赞

以下是您将如何做到的。在 HTML 中创建两个按钮 Click here 1 和 Click here 2 在属性 onmousedown 中给它们函数名称 showResult1 和 showResult2 并创建一个 id 为“answer”的输入,然后在 Script 标签中定义两个变量 a 和 b 并为它们分配整数值 12345和 125 并使用您在两个按钮“showResult1”“showResult2”的 onmousedown 属性中在 html 中定义的名称创建两个函数,并通过 document.getElementById 获取输入的 Id“answer”,并为它们提供 a 和 b 值


var a = 12345;

var b = 125;


function showResult1() {

  document.getElementById("answer").value = a;

}


function showResult2() {

  document.getElementById("answer").value = b;

}

<button id="btn" onmousedown="showResult1()">Click here 1</button>


<button id="btn" onmousedown="showResult2()">Click here 2</button>

<br><br>

<input id="answer" readonly>


查看完整回答
反对 回复 2023-12-14
?
慕无忌1623718

TA贡献1744条经验 获得超4个赞

为了解决这个问题,您有多种选择,例如普通 JavaScript 或使用jQuery 库(如我与您共享的代码片段中所示),结果将是相同的。


如果运行此代码片段,您会注意到,当用户单击任何链接时,输入会自动填充您在请求描述中提供的值。请继续在您的代码中实现这一点,但不要忘记将 jquery 库添加到您的 html 主文件中,以便您使用它。


我当然希望这能有所帮助,伙计。祝你有美好的一天,继续编码,这是一次伟大的冒险!


$(document).ready(function() {

    $("#clickHere01").click(function() {

      $("#txtValues").val("12345");

    });

    

    $("#clickHere02").click(function() {

      $("#txtValues").val("125");

    });

    

    

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<hr>

<h3>Welcome to the www.example.com website</h3>

<p>Please click the below links to fill up this textbox:<br />

    <input type="text" id="txtValues" value="">

</p>


<a href="#" id="clickHere01">Click here 1</a>

<a href="#" id="clickHere02">Click here 2</a>


查看完整回答
反对 回复 2023-12-14
?
斯蒂芬大帝

TA贡献1827条经验 获得超8个赞

寻找我的样品:这就是你想要的吗?


$("#btn_1").on("click",function(){

    $("#data_1").val($(this).val());

});

$("#btn_2").on("click",function(){

    $("#data_1").val($(this).val());

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div>

    <button id="btn_1" value="12345">Click here 1</button>

    <button id="btn_2" value="125">Click here 2</button>

    

    <input id="data_1" type="text" value="" readonly>

</div>


查看完整回答
反对 回复 2023-12-14
  • 4 回答
  • 0 关注
  • 103 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信