0
我有一個包含3個單選按鈕列表的頁面和一個用於選擇報表的jqueryUI「按鈕」。當調用Show（）時，停止JQuery元素在錯誤的位置顯示元素？
但是，「按鈕」在第一次顯示時沒有顯示在正確的位置.show（）n並且我無法解決原因。
第二個/後續調用show（）將按鈕移動到其正確的位置。 刪除顯示：從按鈕的css從一開始就把它放在正確的位置，所以我不知道它爲什麼出現在錯誤的地方？
道歉代碼的質量 - 我已經把一切都到一個視圖中進行演示：
<style type="text/css">
.fieldset_Rule
{
display: inline;
vertical-align:top;
}
.fieldset_Rule legend
{
font-size: 1em;
}
.radio_Rule
{
margin-right: 10px;
}
.fieldset_Accounts
{
display: inline;
vertical-align:top;
}
.fieldset_Accounts legend
{
font-size: 1em;
}
.radio_Accounts
{
margin-right: 10px;
}
.fieldset_Display
{
display: inline;
vertical-align:top;
}
.fieldset_Display legend
{
font-size: 1em;
}
.radio_Display
{
margin-right: 10px;
}
span#reportlink
{
margin-top:10px;
padding: .4em 1em .4em 20px;
text-decoration: none;
cursor: default;
position:absolute;
display:inline;
float:left;
}
span#reportlink span.ui-icon
{
margin: -8px 5px 0 0;
left: .2em;
top: 50%;
float: left;
position: absolute;
}
span#reportlink:hover
{
cursor: pointer;
color: #0060a9;
}
div.reportloading
{
padding: 10px;
color: #002c5a;
font-size: 1.5em;
}
span.reportloadingtext
{
background-position: left center;
background-image: url('ajax-loader.gif');
background-repeat: no-repeat;
padding-left: 40px;
padding-top: 15px;
padding-bottom: 15px;
}
</style>
<script src="../../Scripts/jquery-1.6.4.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.16.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.blockUI.js" type="text/javascript"></script>
<link href="../../Content/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" language="javascript">
/// <reference path="jquery-1.6.4-vsdoc.js" />
var rule = '';
var accounts = '';
var display = '';
var url = '';
$(document).ready(function() {
$('#reportlink').click(function() {
$.blockUI({
message: '<div class="reportloading"><span class="reportloadingtext">Loading Report...</span></div>'
}
);
$(location).attr('href', url);
});
$('input[name="Rule"]').change(function() {
rule = $(this).val();
SetReportLink();
});
$('input[name="Accounts"]').change(function() {
accounts = $(this).val();
SetReportLink();
});
$('input[name="Display"]').change(function() {
display = $(this).val();
SetReportLink();
});
$('#reportlink').toggle();
});
function SetReportLink() {
url = '/TestMvc/' + rule + '/report/' + accounts + "/" + display;
if (rule != '' && accounts != '' && display != '') {
$('#reportlink').show('fast');
$('#reportlink').hover(
function() { $(this).addClass('ui-state-hover'); },
function() { $(this).removeClass('ui-state-hover'); }
);
}
}
</script>
<h2>
Please select one option from each of the following:
</h2>
<fieldset class="fieldset_Rule"><legend>Rule Type</legend>
<div class="radio_Rule"><input id="Rule_I" name="Rule" type="radio" value="I" /><label for="Rule_Irs">I</label></div>
<div class="radio_Rule"><input id="Rule_L" name="Rule" type="radio" value="L" /><label for="Rule_Liquid">L</label></div>
</fieldset>
<fieldset class="fieldset_Accounts"><legend>Accounts</legend>
<div class="radio_Accounts"><input id="Accounts_All" name="Accounts" type="radio" value="All" /><label for="Accounts_All">All</label></div>
<div class="radio_Accounts"><input id="Accounts_Local" name="Accounts" type="radio" value="Local" /><label for="Accounts_Local">Local</label></div>
</fieldset>
<fieldset class="fieldset_Display"><legend>Display As</legend>
<div class="radio_Display"><input id="Display_Equivalent" name="Display" type="radio" value="Equivalent" /><label for="Display_Equivalent">Equivalent</label></div>
<div class="radio_Display"><input id="Display_Natural" name="Display" type="radio" value="Natural" /><label for="Display_Natural">Natural</label></div>
</fieldset>
<span id="reportlink" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-search">
</span>Get Report</span>
任何幫助，非常感激地接受！