【问题标题】:Change button type from button to submit将按钮类型从按钮更改为提交
【发布时间】:2014-07-09 06:40:01
【问题描述】:

我只是不知道单击后如何更改按钮。我只想改变这个按钮

<input type="button" onclick="codename()" id="myButton1" value="New" class="btn" name="New" style="height: 60px; width: 90px">

到这个按钮

<input type="submit" value="Save" class="btn2" name="Query" style="height: 60px; width: 90px">

点击一次。我用过

按钮启用禁用的文本表单,它可以工作。所以基本上我的 NEW BUTTON 会做两件事:首先是启用禁用的表单和按钮(工作),其次是从

<input type="button" onclick="codename()" id="myButton1" value="New" class="btn" name="New" style="height: 60px; width: 90px">` to `<input type="submit" value="Save" class="btn2" name="Query" style="height: 60px; width: 90px"> 

(尚不存在)

这是我现在的退出代码:

<SCRIPT LANGUAGE="JavaScript"><!--
        function codename() {

        if(document.formname.New)
        {
        document.formname.Add.disabled=false;
        document.sapcode.SapCode.disabled=false;
        document.lanecode.LaneCode.disabled=false;
        document.soldto.SoldTo.disabled=false;
        document.soldaddress.SoldAddress.disabled=false;
        document.contactperson1.ContactPerson1.disabled=false;
        document.deliveredto.DeliveredTo.disabled=false;
        document.deliveredaddress.DeliveredAddress.disabled=false;
        document.contactperson.ContactPerson.disabled=false;
        }
        else
        {
        document.formname.Add.disabled=true;
        document.sapcode.SapCode.disabled=true;
        document.lanecode.LaneCode.disabled=true;
        document.soldto.SoldTo.disabled=true;
        document.soldaddress.SoldAddress.disabled=true;
        document.contactperson1.ContactPerson1.disabled=true;
        document.deliveredto.DeliveredTo.disabled=true;
        document.deliveredaddress.DeliveredAddress.disabled=true;
        document.contactperson.ContactPerson.disabled=true;
        }
        }
//-->
        </SCRIPT>
<div id="container">
            <div id="header">
                <div id="img">
                    <img src="dimensiondata.jpg" alt="dimension data" width="250" height="60">
                </div>
                <div id="indexno">
                    <center>Index No.</center> <input type="text" name="indexNo" size="13">
                </div>
                    <form name="formname">
                        <input type="button" onclick="codename()" id="myButton1" value="New" class="btn" name="New" style="height: 60px; width: 90px">
                        <input type="submit" disabled value="Add" class="btn1" name="Add" style="height: 60px; width: 90px">
                    </form>
</div>

【问题讨论】:

  • 您知道可以在页面上显示和隐藏元素吗?
  • 脚本语言?那个指令到底是什么
  • 是的,我非常清楚@Teemu,所以你认为什么会解决这个问题?
  • Ehh...创建两个buttons,隐藏“添加”按钮,直到单击“新建”,然后隐藏“新建”。
  • @Teemu 我不能那样做,因为那不是我同事指导的一部分。

标签: javascript html css forms


【解决方案1】:

this 的事件引用和单击按钮传递给函数,例如:

<input type="button" onclick="codename(event, this)" id="myButton1" value="New" class="btn" name="New" style="height: 60px; width: 90px">

并尝试如下修改您的功能:

function codename(e, elm){
  if(elm.type=='button'){
    var e = e || window.event;
    if(e)
     e.preventDefault()
    elm.type='submit';
    elm.value="Save";
    elm.className= 'btn2';
    elm.name= "query";
  }
//rest of the code
}

【讨论】:

  • 我担心你给我的代码不起作用,按钮闪烁然后它回到原来的方式..它不会变成保存按钮..
  • @user3819129 以及it does work。如果它对您不起作用,那么这是您代码中其他内容的问题...
  • @TilwinJoy 可能会发生错误,因为var e = window.event; 仅限 IE。
  • 哦,是的,当我放置 var e = window.event; 时出现错误,单击后按钮不再出现,我使用的是谷歌浏览器,因为它是我 wamp 服务器中的默认浏览器,有什么我需要的吗?可以解决这个错误吗?
  • @user3819129 如果解决了相关问题,请将答案标记为已接受,如果您想出一种新方法,您可以在整个演示中发布一个新问题并解释您正在尝试什么做...
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-12-29
  • 1970-01-01
  • 1970-01-01
  • 2016-10-10
相关资源
最近更新 更多