一个形成两个操作,具体取决于哪个按钮
One form two actions depending on which button?
我有两个文件,preview.php
& save.php
<form id="create-template" class="form" action="" method="post">
<p class="_50">
<label for="t-name">Template name</label>
<input type="text" name="t-name" class="required"/>
</p>
<p class="_100">
<label for="t-html">Template HTML</label>
<textarea id="t-html" name="t-html" class="required" rows="10" cols="40"></textarea>
</p>
<div class="clear"></div>
<div class="block-actions">
<ul class="actions-left">
<li><a class="button red" id="reset-template" href="javascript:void(0);">Clear</a></li>
</ul>
<ul class="actions-right">
<li><div id="preview"><input type="submit" class="button" value="Preview template" onclick="return false;"></div></li>
<li><input type="submit" class="button" value="Create template"></li>
</ul>
</div>
</form>
当前JS:
$("#preview").click(function() {
$.post('preview.php', {body:$('#t-html').val().replace(/'n/g,'<br />'), function (result) {
//maybe use .ajax instead?
//open preview.php in new window
});
});
如何使用相同的表单,但根据按下的按钮有两个不同的操作?
Preview template
=> preview.php
=> opens to a new tab
Create template
=> save.php
=> posts on same page
您可以为按钮提供一个单击事件处理程序,并相互附加同时的 ajax 调用。
您可以使用JavaScript在新选项卡中打开窗口。
window.open(<url>)
尝试根据单击的按钮设置表单的"目标"属性。
将表单更改为以下内容:
<form id="create-template" class="form" action="" method="post" target="_blank">
<p class="_50">
<label for="t-name">Template name</label>
<input type="text" name="t-name" class="required"/>
</p>
<p class="_100">
<label for="t-html">Template HTML</label>
<textarea id="t-html" name="t-html" class="required" rows="10" cols="40"></textarea>
</p>
<div class="clear"></div>
<div class="block-actions">
<ul class="actions-left">
<li><a class="button red" id="reset-template" href="javascript:void(0);">Clear</a></li>
</ul>
<ul class="actions-right">
<li><input id="preview-form" type="submit" class="button" value="Preview template" /></li>
<li><input type="submit" id="submit-form" class="button" value="Create template" /></li>
</ul>
</div>
</form>
并添加此 JavaScript:
$('#preview-form').click(function(ev) {
$('#create-template').attr('action', 'preview.php');
$('#create-template').attr('target', '_blank');
});
$('#submit-form').click(function(ev) {
$('#create-template').attr('action', 'submit.php');
$('#create-template').attr('target', '');
});
我还没有在所有浏览器中对此进行测试,因此您可能希望这样做。
相关文章:
- jquery移动对齐按钮取决于内容大小
- 下拉值取决于单选按钮的选择
- JQuery 操作取决于选择的单选按钮 - if/else
- 可变标签取决于选择的单选按钮
- 我将如何编写考虑多个单选按钮和变量输出的 JavaScript,具体取决于选择的单选按钮
- 将两个函数绑定到一个按钮,具体取决于按钮的按下时间长短
- (飞镖)我希望触发两个不同的onclick功能,具体取决于单击时是否选中了单选按钮.我该怎么做
- 如何下载多个文件之一,具体取决于所选的单选按钮
- 一个形成两个操作,具体取决于哪个按钮
- 防止验证聚焦,具体取决于单选按钮
- Javascript执行函数取决于两个按钮
- 放大h1,具体取决于所选的单选按钮
- 重定向提交按钮取决于选项
- 显示/隐藏下载按钮取决于用户是否在ios上
- 显示不同的
取决于单选按钮(在Knockout中) - 在表中,每行都有一个编辑按钮.显示或隐藏按钮取决于本行中的另一个值
- 启用/禁用按钮,具体取决于文本框中的输入是否在选择框中
- 显示/隐藏Div取决于asp:单选按钮选择
- 下一个问题取决于你按的按钮
- 卡翻转效果使用CSS3旋转,但有多个面取决于按钮按下