Question

我很困惑为什么当我点击一个按钮时：按下打开一个帮助功能，当对话框打开时，刷新浏览器？如果有人能查看我的代码并向我显示我的错误，我将不胜感激。如果我单击vidresize div，它指向localhost索引页面并刷新浏览器并关闭对话框。我怀疑它可能是就绪函数。但作为一个完整的nOOb，我会知道:-)。感谢

<script type="text/javascript">
 function help(){
    $(function() {
        $("#help").dialog({
            autoOpen: false,
            resizable: true,
            modal: true,
            title: "Action Help panel",
            width: 470,
            beforeclose: function (event, ui) {                    
                    jAlert("Thank you for using the help area\nand we hope it was of use to you.",
                                                     'Help area');                        
            },
            close: function (event, ui) {                    
            }        
        });
    });
    $("#help").dialog('open');
 }
</script>

++++++ UPDATE +++++++

<div id="help" style="display:none;">
  <div id="help2">
    <ul>
    <li>
    <h6>ADDING A USER</h6>
    <p>To add a user, simply click the 'ADD' button from the menu and enter all the details. Please complete all
        the fields. The user details will then be added to the Contacts, Company and User areas.</p>

    <p>Simply hold the left mouse button and drag
      until the column changes to your preffered size.</p>
    </li>

    <li>
    <h6>RESIZING COLUMNS</h6>
    <p>If you find that the columns are not the size you would like, you can resize them 
      by hovering the mouse over the column and a resize line will appear.</p>

    <p>Simply hold the left mouse button and drag until the column changes to your prefered size.
        We have prepared a sample video for you to follow.</p>

    <br />
     <p> 
    <ul>
      <li><a href"#">Resizing Columns Video</a></li><br />
    </ul>

    </li>
    </p>
     <div id="vidresize">Video will be shown here</div>
    <br />
    <li>
    <h6>SHOW/HIDE COLUMNS</h6>

    <p>If you find that your grid is cluttered and you may perhaps only need to view and work on a cretain field,
        you can simply hide that field. Hover your mouse over the header in the grid and a small down arrow will
        appear. Simply click the arrow and you will be presented with the fields in the grid and simply untick the
        field you wish to hide. To show a field, simply reverse the tick process. Please note, that in Internet Explorer
        it may be necessary to adjust the grid width first then the arrow will appear.</p>
    <br />
    <ul>
      <li><a href"#">Show/Hide Columns Video</a></li><br /><br />
      </ul>
    </li>

    <li>
    <h6>REORDERING COLUMNS</h6>
    <p>You have the facility if you wish to reorder the columns simply by selecting the column name
        and holding the left mouse button drag the column to where you wish and simply release the mouse button.</p>
    </li>

    <li>
    <h6>CHANGE COLUMN WIDTHS</h6>
    <p>If you find that some of the columns are too small and not showing all the data, you can resize them to amother size.
        If you hover your mouse in the line between the names, your cursor will change and then simply drag the column to the desired width.</p>
    </li>

    <li>
    <h6>SEARCHING ITEMS</h6>
    <p>By clicking the magnifying glass icon, a search box will appear and you can enter your search criteria, then
       press the enter key. All search results are displayed in the grid.</p>
    </li>

    <li>
    <h6>DELETING ITEMS</h6>

    <p>To delete an item, simply click the item you wish to delete, then confirm your selection.
        please be aware that this activity is permanent so use with caution.</p>
    </li>

    <li>
    <h6>EDITING ITEMS</h6>

    <p>If you wish to edit an entry, simply click on the row that you wish to edit and proceed to update any records that need updating.
        Then, press the update button and your update is finished. Please note, that you can only select 1 row to edit at a time.
    </p></li></ul>
  </div></div>

<script language="javascript" type="text/javascript">

            $(function() {
                $("#vidresize").hide();

            $('li a').click(function () {
                $("#vidresize").show();

            });});

</script>

Answer 1

是按钮还是链接？因为如果你有类似的东西：

<a href="something" onpress="help();">Help</a>

默认行为是关注链接。尝试一下这个链接：

$("#theIdOfTheButton").click(function(event) {
    event.preventDefault();
    // the rest of your code that opens the dialog
}

Answer 2

似乎可能无法覆盖按钮的默认行为。尝试：

 function help(){
    return false;
    // rest of your code

没有看到按钮代码，这就是我所能建议的。

打开jquery对话框刷新页面

2 个答案: