Fatal编程技术网
  • javascript/
  • Javascript 1个表单，带有1个输入字段和2个按钮；需要根据使用的按钮更改输入名称吗

Javascript 1个表单，带有1个输入字段和2个按钮；需要根据使用的按钮更改输入名称吗

javascript forms button

Javascript 1个表单，带有1个输入字段和2个按钮；需要根据使用的按钮更改输入名称吗,javascript,forms,button,field,Javascript,Forms,Button,Field,我需要有一个单输入字段和两个按钮的表单 棘手的是，我需要根据按下的按钮更改输入字段名称 <FORM name="Form1" id="num_colis" method="post"> <INPUT TYPE="text" name="abc OR xyz" value=""> <INPUT type="button" value="Colissimo" onclick="return OnButton1();"> <INPUT type="button

我需要有一个单输入字段和两个按钮的表单

棘手的是，我需要根据按下的按钮更改输入字段名称

<FORM name="Form1" id="num_colis" method="post">
<INPUT TYPE="text" name="abc OR xyz" value="">
<INPUT type="button" value="Colissimo" onclick="return OnButton1();">
<INPUT type="button" value="CSUIVI" onclick="return OnButton2();">
</FORM>
<script language="Javascript">
<!--
function OnButton1()
{
    document.Form1.action = "http://www.site1.fr/suivi"    
    document.Form1.submit();             // Submit the page
    return true;
}

function OnButton2()
{
    document.Form1.action = "http://www.site2.fr/suivi"
    document.Form1.submit();             // Submit the page
    return true;
}
-->
</script>
要使其正常工作，我需要在按下按钮1时使用“INPUT TYPE=“text”name=“abc”，在按下按钮2时使用类似的“INPUT TYPE=“text”name=“xyz”

<FORM name="Form1" id="num_colis" method="post">
<INPUT TYPE="text" name="abc OR xyz" value="">
<INPUT type="button" value="Colissimo" onclick="return OnButton1();">
<INPUT type="button" value="CSUIVI" onclick="return OnButton2();">
</FORM>
<script language="Javascript">
<!--
function OnButton1()
{
    document.Form1.action = "http://www.site1.fr/suivi"    
    document.Form1.submit();             // Submit the page
    return true;
}

function OnButton2()
{
    document.Form1.action = "http://www.site2.fr/suivi"
    document.Form1.submit();             // Submit the page
    return true;
}
-->
</script>
我到处寻找解决方案，但都没有找到，有没有javascript解决方案或技巧可以实现这一点？

使用jquery

<FORM name="Form1" id="num_colis" method="post">
<INPUT TYPE="text" id="name" name="abc OR xyz" value="">
<INPUT type="button" id="button1" value="Colissimo">
<INPUT type="button" id="button2" value="CSUIVI">
</FORM>
<script language="Javascript">
$('#button1').click(function() {
  $('#name').attr('name', 'abc');
});
$('#button2').click(function() {
  $('#name').attr('name', 'xyz');
});
</script>


$（'#按钮1'）。单击（函数（）{
$（'#name'）.attr（'name'，'abc'）；
});
$（'#按钮2'）。单击（函数（）{
$（'#name'）.attr（'name'，'xyz'）；
});
为什么不使用隐藏的输入字段

<INPUT TYPE="hidden" name="abc_or_xyz" value="">
<INPUT TYPE="text" name="text" value="">
服务器端您可以检查请求属性abc_或xyz，这样就可以用纯JavaScript对请求属性文本进行不同的解释。

将id属性设置为输入

<INPUT TYPE="text" id="textField" value="">


function OnButton1()
{
    document.getElementById('textField').name = 'abc';
    document.Form1.action = "http://www.site1.fr/suivi"
    document.Form1.submit(); // Submit the page

}
function OnButton2()
{
    document.getElementById('textField').name = 'xyz';
    document.Form1.action = "http://www.site2.fr/suivi"
    document.Form1.submit(); // Submit the page

}


函数OnButton1（）
{
document.getElementById（'textField'）。name='abc'；
document.Form1.action=”http://www.site1.fr/suivi"
document.Form1.submit（）；//提交页面
}
函数OnButton2（）
{
document.getElementById（'textField'）。name='xyz'；
document.Form1.action=”http://www.site2.fr/suivi"
document.Form1.submit（）；//提交页面
}
运行函数时，只需为文本字段分配一个id，并更改id的名称即可。 在这里，我为输入分配了一个id，即“myInput”，当您单击按钮时，该函数正在更改字段的名称，其中字段的id为“myInput”




交换
函数abc（）{
document.getElementById（“名称”）.setAttribute（“名称”、“abc”）；
}
函数xyv（）{
document.getElementById（“名称”）.setAttribute（“名称”、“xyv”）；
}
您想用它实际实现什么？也许有另一种方法来做你想做的事。更改输入字段的名称听起来不像是“好方法”。哇，我简直不敢相信，响应如此之快！现在就试试吧，非常感谢你！非常感谢阿斯哥特。我需要更改名称，而不是值，所以只需更改为document.Form1.abc_或_xyz.name即可！ 
<FORM name="Form1" id="num_colis" method="post">
<INPUT TYPE="text" id="myInput" name="abc OR xyz" value="">
<INPUT type="button" value="Colissimo" onclick="return OnButton1();">
<INPUT type="button" value="CSUIVI" onclick="return OnButton2();">
</FORM>
<script language="Javascript">
<!--
function OnButton1()
{
    document.getElementById('myInput').name='abc';
    document.Form1.action = "http://www.site1.fr/suivi"    
    document.Form1.submit();             // Submit the page
    return true;
}

function OnButton2()
{
    document.getElementById('myInput').name='xyz';
    document.Form1.action = "http://www.site2.fr/suivi"
    document.Form1.submit();             // Submit the page
    return true;
}
-->
</script>

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Swap</title>
<script type="text/javascript">
function abc(){
document.getElementById("name").setAttribute("name", "abc");
}
function xyv(){
document.getElementById("name").setAttribute("name", "xyv");
}
</script>
</head>

<body>
<form name="Form1" id="num_colis" method="post">
    <INPUT TYPE="text" id="name" name="abc OR xyz" value="">
    <INPUT type="button" id="button1" value="Colissimo" onclick="abc()">
    <INPUT type="button" id="button2" value="CSUIVI" onclick="xyv()">
</form>
</body>
</html>