我使用一个国家的选择框,当用户选择一个国家,然后添加分支链接出现,用户在该国家添加分支,但是当用户想要更改国家,那么该国家的所有分支应该被破坏.在更改国家之前,确认框出现并显示警告.一切都正常,但是
如果我在确认框上点击“取消”,那么分支仍然存在,但是选择框值更改为新的国家(即使我点击取消)
我需要,如果用户取消更改国家,那么选择框值也将是以前的国家.
<form>
<table>
<tr>
<td >Select Country :</td>
<td >
<select name="country_id" id="country" class="selectBox" title="Please select country" validate="required:true" onchange="javascript:showBranch();" >
<option value="" >Select Country </option>
<option value="00002" > Afghanistan</option>
<option value="00054" > Croatia</option>
<option value="00060" > Dominica</option>
<option value="00062" > Ecuador</option>
<option value="00064" > El Salvador</option>
<option value="00067" > Estonia</option>
<option value="00099" > India</option>
</select>
</td>
</tr>
<tr>
<td> </td>
<td>
<div id="branches">
<!-- Raw Branch Details-->
<div><span><a title="First Branch" href="">First</a></span></div>
<div><span><a title="Second Branch" href="">Second</a></span></div>
<div><span><a title="Third Branch" href="">Third</a></span></div>
</div>
<div id="brancherror"></div>
</td>
</tr>
<tr>
<td> </td>
<td align="left">
<span id="branchLink" style="display:none" >
<a href="#" class="thickBox" id="branchhref">Add Branch(es)</a></span>
</td>
</tr>
</table>
</form>
function showBranch()
{
var countryid = jQuery('#country').val();
if (jQuery("#branches>div").size())
{
if (confirm('If country has been changed then data corresponding to present branches will lost.Do you want to continue?'))
{
jQuery('#branches').html('');
}
jQuery('#branchhref').attr({href: "index.PHP?option=com_advertise&view=createbranch&format=raw&country=" + countryid + "&KeepThis=true&TB_iframe=true&height=500&width=900",title: 'Add Branch'});
}
else
{
jQuery('#branchhref').attr({href : "index.PHP?option=com_advertise&view=createbranch&format=raw&country=" + countryid + "&KeepThis=true&TB_iframe=true&height=500&width=900",title:'Add Branch'});
return true;
}
jQuery('#branchLink').show();
}
解决方法
您可以只存储以前的值,并根据需要将其设置回来,如下所示：
var countryVal;
$("#country").change(function() {
var newVal = $(this).val();
if (!confirm("Are you sure you wish to destroy these country branches?")) {
$(this).val(countryVal); //set back
return; //abort!
}
//destroy branches
countryVal = newVal; //store new value for next time
});
或者使用.data()作为@Gaby建议,像这样：
$("#country").change(function() {
var newVal = $(this).val();
if (!confirm("Are you sure you wish to destroy these country branches?")) {
$(this).val($.data(this,'val')); //set back
return; //abort!
}
//destroy branches
$.data(this,'val',newVal); //store new value for next time
});
