在表单中使用 php 和 java 脚本
我有点失落。我想要实现的是：
- 我自己的自定义按钮
- 更改 onMouseOver 等'
- 保持其大小
- 将信息发布到 php 服务器端代码
我缺少的是：
- 帖子 - 我无法弄清楚如何结合js和; php
- 按钮大小 - 我的代码设置了原始按钮的大小，但在翻转后它会改变
代码：
<html>
<head>
</head>
<body>
<script>
function form_on_click(frm)
{
document.buttonMore.src='bottom_more_click.JPG';
frm.submit();
}
</script>
<div style="position: absolute; left: 120px; top: 90px; background-image: url(myBackgroundPicture.jpg);
background-repeat:no-repeat; width: 800px; height: 280px; padding: 15px;">
<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<input type="text" name="whatever" size= "55" height="100" lang="en" dir="ltr" style="margin-top: 188px; margin-left: 95px; height: 20px; background-color: transparent; border:none;
color: #FFFFFF; font-family: Verdana; font-weight: none; font-size: 18px;">
<a onmouseover="document.buttonMore.src='bottom_more_hover.JPG'"
onmouseout="document.buttonMore.src='bottom_more_reg.JPG'"
onmousedown= "form_on_click(this.form) this.form.submit()"
onmouseup="document.buttonMore.src='bottom_more_hover.JPG'">
<img src="bottom_more_reg.jpg" name="buttonMore" height="30" width="173" border="0" alt="MORE!" style="margin-bottom:-10px; margin-left: 15px; height: 30px; width: 100px;">
</a>
</form>
</div>
</body>
I am a little bit lost. What I want to achieve is:
- my own custom button
- change onMouseOver etc'
- keep it's size
- post the information to a php server side code
What I'm missing is:
- The post - I couldn't figure out how to combine js & php
- The Button size - my code sets a size for the original button but after the rollover it changes
The code:
<html>
<head>
</head>
<body>
<script>
function form_on_click(frm)
{
document.buttonMore.src='bottom_more_click.JPG';
frm.submit();
}
</script>
<div style="position: absolute; left: 120px; top: 90px; background-image: url(myBackgroundPicture.jpg);
background-repeat:no-repeat; width: 800px; height: 280px; padding: 15px;">
<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<input type="text" name="whatever" size= "55" height="100" lang="en" dir="ltr" style="margin-top: 188px; margin-left: 95px; height: 20px; background-color: transparent; border:none;
color: #FFFFFF; font-family: Verdana; font-weight: none; font-size: 18px;">
<a onmouseover="document.buttonMore.src='bottom_more_hover.JPG'"
onmouseout="document.buttonMore.src='bottom_more_reg.JPG'"
onmousedown= "form_on_click(this.form) this.form.submit()"
onmouseup="document.buttonMore.src='bottom_more_hover.JPG'">
<img src="bottom_more_reg.jpg" name="buttonMore" height="30" width="173" border="0" alt="MORE!" style="margin-bottom:-10px; margin-left: 15px; height: 30px; width: 100px;">
</a>
</form>
</div>
</body>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
更新：
哦，当然......对不起。你完全正确。我不知道我的头在哪里。
尝试其他方法，再次删除此行
并将其替换为
只是一个建议，为什么不使用...
...然后在 CSS 中自定义它？
编辑
关于按钮的大小，这些jpeg文件大小相同吗？
UPDATED:
Oh sure.. excuse me. You're totally right. I don't know where do I have my head.
Try something else, remove this line again
And replace it by
Just a suggestion, why don't you use an...
...and then customize it in CSS?
EDIT
About the size of the button, are those jpeg files equally sized?
最简单的方法是使用 JQuery。只需在 JQuery 中执行几个简单的步骤即可完成您想做的所有事情。鼠标悬停/移出即可提交所有内容以及更多内容。
我爱上了 JQuery...
The easiest way would be to use JQuery. All of what you want to do can be done with just a few simple steps in JQuery. The mouseover/out submit all of it and tons more.
I fell in love with JQuery...