2014-12-23 113 views
-1

我有一個網站表單網站,隨機選擇某些行或單個文本框將禁止選擇以獲得焦點。光標不會從文本框的邊界處的箭頭更改爲文本管道。有時,從指針到文本管道的更改將發生在文本框的中間。如果我調整browswer窗口的大小,我可以改變這種行爲。一般來說,最大限度地運行browswer使其消失。我搜索了這個,我沒有發現任何類似的SO,或者我使用了錯誤的搜索條件。無法在瀏覽器上選擇文本框調整大小

Web Form Example http://uber-writer.com/wp-content/uploads/2014/12/SchCIncomeForm.png

的圖像示出了具有一些假設數據的典型表。 「攤銷期限」行造成了問題。下面顯示的是表格標記:

<table class="incomeDataEntryTblNarrow_wTotal"> 
    <tr> 
     <td> 
      Tax Year: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_oneYearAgoYear" Text='<%# Eval("oneYearAgoYear") %>' runat="server" Width="40px"></asp:TextBox> 
     </td> 
     <td> 
      <asp:Label ID="lblSchedC_prevYear" runat="server" Text="INVLD" Font-Size="10"></asp:Label> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      W2 Line 5: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_w2box5_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("w2box5_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_w2box5_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("w2box5_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Line 6<br />Other Income: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line6_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("line6_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" onkeydown="return jsDecimalsRO(event);" ></asp:TextBox> 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line6_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("line6_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" onkeydown="return jsDecimalsRO(event);" ></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Line 12<br />Depletion: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line12_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("line12_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line12_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("line12_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Line 13<br />Depreciation: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line13_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("line13_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line13_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("line13_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Line 24b<br />Meals & Entertainment: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line24b_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("line24b_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line24b_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("line24b_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Line 30<br />Expenses Home Use: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line30_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("line30_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line30_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("line30_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Line 31<br />Net Profit: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line31_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("line31_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Line31_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("line31_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Amortization Exp<br />Part V: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Amort_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("Amortization_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Amort_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("Amortization_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Casualty Loss<br />Part V: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Casualty_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("Casualty_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Casualty_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("Casualty_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Other Exp<br />Part V: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Other_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("OtherExp_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_Other_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("OtherExp_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Business Miles<br />Part IV Linve44a: 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_BizMiles_OneYearAgo" Text='<%# Eval("BizMiles_OneYearAgo") %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
     <td> 
      <asp:TextBox ID="txtSchedC_BizMiles_TwoYearsAgo" Text='<%# Eval("BizMiles_TwoYearsAgo") %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Total Income: 
     </td> 
     <td> 
      <asp:Label ID="lblFinalIncomeY1" Text='<%# string.Format("{0:C}",Eval("finalIncomeY1")) %>' runat="server" Font-Size="12px" width="75" style="text-align:right;"></asp:Label> 
     </td> 
     <td> 
      <asp:Label ID="lblFinalIncomeY2" Text='<%# string.Format("{0:C}",Eval("finalIncomeY2")) %>' runat="server" Font-Size="12px" width="75" style="text-align:right;"></asp:Label> 
     </td> 
    </tr> 
</table> 

的文本框的CSS是這裏

.incomeTextBox { 
    width: 85px; 
    text-align: right; 
    cursor: text; 
    z-index: 999; 
} 

我刪除了空白,並試圖在現場,得到了相同的反應。

<table class="incomeDataEntryTblNarrow_wTotal"> 
<tr> 
    <td>Tax Year:</td> 
    <td><asp:TextBox ID="txtSchedC_oneYearAgoYear" Text='<%# Eval("oneYearAgoYear") %>' runat="server" Width="40px"></asp:TextBox></td> 
    <td><asp:Label ID="lblSchedC_prevYear" runat="server" Text="INVLD" Font-Size="10"></asp:Label></td> 
</tr> 
<tr> 
    <td>W2 Line 5:</td> 
    <td><asp:TextBox ID="txtSchedC_w2box5_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("w2box5_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox></td> 
    <td><asp:TextBox ID="txtSchedC_w2box5_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("w2box5_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" ></asp:TextBox></td> 
</tr> 
<tr> 
    <td>Line 6<br />Other Income:</td> 
    <td><asp:TextBox ID="txtSchedC_Line6_OneYearAgo" Text='<%# string.Format("{0:C}",Eval("line6_OneYearAgo")) %>' runat="server" CssClass="incomeTextBox" onkeydown="return jsDecimalsRO(event);" ></asp:TextBox></td> 
    <td><asp:TextBox ID="txtSchedC_Line6_TwoYearsAgo" Text='<%# string.Format("{0:C}",Eval("line6_TwoYearsAgo")) %>' runat="server" CssClass="incomeTextBox" onkeydown="return jsDecimalsRO(event);" ></asp:TextBox></td> 
</tr> 
+0

如果我不得不猜測我會說這是因爲你的html中的空白。也許試着消除它,看看光標問題是否已修復。此外,您不必將光標置於輸入框上,因爲它默認爲文本光標。 – Slime

+0

感謝您的建議,但我只是試了一下,並沒有改變結果。你知道什麼管理文本框的熱點,以及它如何與渲染的文本框本身不同? – stamm528

+0

也許嘗試添加一個高度並顯示給你的班級? – Slime

回答

0

最終答案最終成爲UpdateProgress消息框的包裝div。

<%--  <div class="processingStatus">--%> 
     <asp:UpdateProgress ID="UpdateProgress1" runat="server"> 
      <ProgressTemplate> 
       <div class="processingMessage processingStatus"> 
        Updating... 
       </div> 
      </ProgressTemplate> 
     </asp:UpdateProgress> 
<%--  </div> --%> 

在代碼片段中,我已經註釋掉了包裝div。包裝div的.css本質上是創建一個透明的div,它可以阻止任何背後的東西。這就解釋了爲什麼這個問題看起來是隨機的,並且在屏幕重新調整大小時會改變。 UpdateProgress上的樣式將使消息居中在屏幕上,但屏幕上的內容不居中。我最終殺死了wrapper div,並將css類移到ProgressTemplate中的div中。部署了更改,現在按預期工作。

0

可以通過固定表格寬度 解決這個重疊的問題,比方說

table 
{ 
width:600px; 
} 

將固定在調整瀏覽器 重疊的問題,但你需要向右滾動才能看到數據的其餘部分

+0

Naveen,感謝您的建議。事實證明,這是我的UpdateProgress消息框的包裝div。包裝div風格阻擋了屏幕的一小塊區域,無論文本框在該div後面滑動都會被阻塞。因此對問題的隨意感覺。 – stamm528

相關問題