CN100448237C

CN100448237C - Method for implementing free switching between homepage controls

Info

Publication number: CN100448237C
Application number: CNB2003101172793A
Authority: CN
Inventors: 包俊文
Original assignee: Zhuhai Kingsoft Software Co Ltd
Current assignee: Zhuhai Kingsoft Software Co Ltd
Priority date: 2003-12-10
Filing date: 2003-12-10
Publication date: 2008-12-31
Anticipated expiration: 2023-12-10
Also published as: CN1547365A

Abstract

The present invention provides a method for implementing free switching between homepage control components. Attributes are defined by a user on a standard control component so as to change the standard control component into a non-standard control component; besides, a next control component is determined according to a key pressed by the user and values of user-defined attributes of the non-standard control component, and thus, the obtained next control component is used as the current control component. As a result, the present invention ensures flexible connection relationship between homepage control components, and users can realize freely switching between the homepage control components.

Description

The method of freely switching between the realization webpage control

Technical field

The present invention relates to the webpage on the Internet, relate in particular to the control technology on the webpage.

Background technology

The Internet is more and more universal in the modern life, and terminal all over the world can be by Internet connection together; The terminal use can pass through telephone wire, perhaps optical cable, the computer of oneself is connected on the Internet, also can obtain simultaneously own needed information, data etc. by the webpage on the view Internet, for example: the terminal use can be by the page download file on the view Internet, music and browse news etc.Webpage of the prior art includes many standard controls by the html language definition (so-called standard control refers to the control of hypertext link language HTML definition), for example:

Standard control code about form and input control:

<form?action＝/cgi-bin/post-query?method＝POST>

Your name:

＜input type=text name=name 〉!--text input frame--}

The network address of your homepage:

＜input type=text name=network address value=http: //!--network address input frame--}

Password:

＜input type=password name=password 〉!--password input frame--}

＜input type=submit value=" transmission " 〉!--submitting to--}

＜input type=reset value=" resets " 〉!--reseting--}

</form>

For above-mentioned standard control about form and input, the user by the TAB key on the keyboard only to select above-mentioned control according to priority;

The standard control of relevant form in the prior art:

<table>

＜tr 〉!--definition of table row--}

＜th〉Food＜/th 〉!--gauge outfit definition--}

＜th〉Drink＜/th 〉!--the gauge outfit definition }

＜th〉Sweet＜/th 〉!--the gauge outfit definition }

</tr>

<tr>

＜td〉A＜/td 〉!--list cell definition--}

＜td〉B＜/td 〉!--list cell definition--}

＜td〉C＜/td 〉!--list cell definition--}

</tr>

</table>

Equally, for the standard control of the relevant form that exists in the above-mentioned prior art, the user by the TAB key on the keyboard only sequentially to select the cell in the form; For standard control of the prior art, the user cannot select between each control by self-defined or other mode more freely by the TAB key on the keyboard.

Summary of the invention

At the above-mentioned technical problem that exists in the prior art, the present invention proposes the method for freely switching between a kind of WEB of realization webpage control, comprise the following steps:

Define the Custom Attributes of non-standard control;

Judge the key of being pressed by the user on the keyboard;

The key of pressing according to the user and the self-defining property value of non-standard control are determined next control; And to make the next control that obtains be current control;

When described non-standard control was non-standard grid control, the key that the user presses comprised: self-defining downward directionkeys, the directionkeys that makes progress, directionkeys left and directionkeys to the right;

If the user supresses downward directionkeys, judge whether to exist the next line cell, if there is the next line cell, so, cursor is moved to the next line cell, make the next line cell become current cell, otherwise cursor position is constant;

When the user supresses directionkeys upwards, judge whether to exist the lastrow cell, if there is the lastrow cell, so, cursor is moved to the lastrow cell, make the lastrow cell become current cell, otherwise cursor position is constant;

When the user supresses left directionkeys, judge whether the left side deposits cell, if there is cell in the left side, so,, make the cell on the left side become current cell, otherwise cursor position is constant with the cell that cursor moves to left;

When the user supresses to the right directionkeys, judge whether the right deposits cell, if there is cell in the right, so,, make the cell on the right become current cell, otherwise cursor position is constant with the cell that cursor moves to right.

Also comprise: according to the data type of current cell column, add the input control of corresponding data type, so that the user imports the data of corresponding data type in current cell, and when cursor left current cell, the data of being imported were presented in the current cell.

The Custom Attributes of described non-standard control comprises:

The CustomTable attribute, being used for the definition tables control is that non-standard grid control still is the criteria table control.

Wherein said CustomTable attribute further comprises:

When the CustomTable of grid control property value was true, this grid control was non-standard grid control; When the CustomTable of grid control property value is false, when perhaps grid control did not define the CustomTable attribute, this grid control was the criteria table control.

Wherein said non-standard control is non-standard input control.

The key that described user presses comprises TAB key and TAB+Shift key.

Described Custom Attributes comprises: TabNext attribute and TabPrevious attribute;

Described TabNext attribute is used to define the next input control that current input control will link;

Described TabPrevious attribute is used to define the last input control that current input control will link.

The value of described TabNext attribute is the ID value of the current input control next input control that will link;

The value of described TabPrevious attribute is the ID value of the current input control last input control that will link.

When the user supresses the TAB key, obtain the TabNext property value of current input control;

Whether the TabNext property value of judging current input control is null, if, do not do any operation, current control still makes current control; Otherwise, continue to judge whether to exist TabNext property value designated control;

If there is no TabNext property value designated control is not then done any operation, and current control still is current control; If exist, then cursor is moved to TabNext property value designated control, make TabNext property value designated control become current control.

When the user supresses the TAB+Shift key, obtain the TabPrevious property value of current input control;

Whether the TabPrevious property value of judging current input control is null, if, do not do any operation, current control still makes current control; Otherwise, continue to judge whether to exist TabPrevious property value designated control;

If there is no TabPrevious property value designated control is not then done any operation, and current control still is current control; If exist, then cursor is moved to TabPrevious property value designated control, make TabPrevious property value designated control become current control.

Because the present invention has adopted Custom Attributes, for example: attributes such as TabNext and TabPrevious, make that the linking relationship between the control on the WEB webpage is more flexible, thereby, the user can pass through TAB key, TAB+Shift key, or other self-defining key freely switches between the control on the WEB webpage more easily; By non-standard grid control of the present invention, the user is the data of input corresponding data type in the form on webpage easily.

Description of drawings

Fig. 1 is the flow chart of the free changing method between the webpage control;

Fig. 2 is the schematic diagram of the non-standard control of definition;

Fig. 3 is non-standard control and standard control schematic diagram;

Fig. 4 is the flow chart of data entry device in the non-standard form.

Embodiment

Before the explanation specific embodiments of the invention, let us is at first had a look the standard control that uses the html language definition in the prior art, for example:

Standard input control:

<form?action＝/cgi-bin/post-query?method＝Post>

＜input type=" text " name=" name1 "!--text input frame--}

<span>

＜input type=" text " name=" name2 "!--text input frame--}

＜input type=" hidden " name=" name3 "!--hiding frame--}

＜input type=" radio " name=" name4 "!--radio box--}

</span>

＜input type=" text " name=" name5 "!--text box--}

＜input type=" submit "!--submitting to--}

＜input type=" reset "!--reseting--}

</form>

The criteria table control:

<table?border＝”1”cellspacing＝”0”cellpadding＝”0”>

＜thead 〉!--definition gauge outfit--}

＜tr 〉!--definition list is capable--}

＜td style=" width:120 " name=" cinvname " title＜/td 〉

!--definition list cell--}

＜td style=" width:120 " name=" fquantity " quantity＜/td 〉

!--definition list cell--}

＜td style=" width:120 " name=" fprice " unit price＜/td 〉

!--definition list cell--}

＜td style=" width:120 " name=" fmoney " amount of money＜/td 〉!--definition list cell--}

</tr>

</thead>

＜tbody 〉!-definition list body--}

<tr>

</tr>

<tr>

</tr>

</tbody>

<tfoot>

<tr>

＜td align=" center " add up to＜/td 〉

</tr>

</tfoot>

</table>

On the basis of the standard control of above-mentioned prior art, the present invention has added self-defining attribute in control: TabNext attribute and TabPrevious attribute, and the Custom Attributes CustomTable attribute that is used for grid control.We are referred to as non-standard control this control with Custom Attributes;

The ID property value of the next control that the criteria of right and wrong control that defines in the TabNext attribute will link;

The ID property value of the last control that the criteria of right and wrong control of TabPrevious attribute definition will link;

The CustomTable attribute definition be that form is an also criteria of right and wrong form of criteria table; That is, if CustomTable=true, form is non-standard form so, CustomTable=false or do not define the CustomTable attribute, and form is a criteria table so.

Below we describe the method for freely switching between the realization webpage control of the present invention in detail in conjunction with Fig. 1;

At first, step S101, the keyboard of catching on the Webpage is pressed incident; When user's browsing page page, whether the seizure user supresses certain key on the keyboard, and obtains the key assignments that it is pressed;

Step S102 according to the key assignments that step S101 obtains, judges that key that the user presses is that key on the keyboard;

Step S104 if the user does not press the TAB key, does not press the TAB+Shift key simultaneously yet;

Step S107 does not do any operation so;

Step S103 is if the user only supresses the TAB key;

Step S106 obtains the TabNext property value of current control;

Step S120 judges whether the TabNex t property value of current control is null;

Step S122 when the TabNext property value of current control is null, does not do any operation, and cursor still rests on the current control;

Step S109 when the TabNext property value of current control is not null, judges whether to exist the control of the TabNext property value appointment of current control;

The if there is no control of the TabNext property value appointment of current control, execution in step S122 does not do any operation so, and cursor still rests on the current control;

Step S121 if there is the control of the TabNext property value appointment of current control, moves to cursor TabNext property value designated control so, that is, make the control of TabNext property value appointment become current control;

Step S105 is if the user supresses TAB and shift key simultaneously;

Step S108 obtains the TabPrevious property value of current control;

Step S123 judges whether the TabPrevious property value of current control is null;

Step S125 when the TabPrevious property value of current control is null, does not do any operation, and cursor still rests on the current control;

Step S124 when the TabPrevious property value of current control is not null, judges whether to exist the control of the TabPrevious property value appointment of current control

Step S126 if there is the control of current control TabPrevious property value appointment, moves on to cursor the control of TabPrevious property value appointment so, that is, the control of TabPrevious property value appointment is current control;

Specific embodiment one:

With reference to Fig. 2, with respect to the standard control of above-mentioned use html language definition, we can define the non-standard control that a present invention uses, and concrete control definition code is as follows:

<form?action＝/cgi-bin/post-query?method＝Post>

<input?ID＝”ID-A”type＝”text”name＝”name1”TabNext＝”ID-B”>

<span?ID＝”ID-B”TabPrevious＝”ID-A”TabNext＝”ID-C”>

<input?type＝”text”name＝”name2”>

<input?type＝”hidden”name＝”name?3”>

<input?type＝”radio”name＝”name4”>

</span>

<input?ID＝”ID-C”type＝”text”name＝”name5”

TabPrevious＝”ID-B”>

<input?type＝”submit”>

<input?type＝”reset”>

</form>

We claim＜input ID=in the present invention " ID-A " type=" text " name=" name1 " TabNext=" ID-B " be non-standard control A;

<span?ID＝”ID-B”TabPrevious＝”ID-A”TabNext＝”ID-C”>

<input?type＝”text”name＝”name2”>

<input?type＝”hidden”name＝”name3”>

<input?type＝”radio”name＝”name4”>

＜/span〉be non-standard control B;

＜input ID=" ID-C " type=" text " name=" name5 " TabPrevious=" B " be non-standard control C;

Wherein, the ID property value among non-standard control A, B, the C is set to ID-A, ID-B and ID-C respectively; The ID property value is the value of unique identification control.

The TabNext attribute of non-standard control A is set to the ID property value of non-standard control B, i.e. ID-B;

The TabPrevious property value of non-standard control B is set to the ID property value of non-standard control A, i.e. ID-A;

The TabNext attribute of non-standard control B is set to ID-C;

The TabPrevious property value of non-standard control C is set to ID-B;

Below we with in conjunction with above-mentioned concrete relevant non-standard control A, the code of B, C, the method for freely switching between the realization webpage control of the present invention is described in more detail:

At first, we suppose current control criteria of right and wrong control A, that is, current control is:

＜input ID=" ID-A " type=" text " name=" name1 " TabNext=" ID-B " time, so,

When user's browsing page page, whether the seizure user supresses certain key on the keyboard, and obtains the key assignments that it is pressed;

According to the key assignments that obtains, what the judgement user pressed is that key;

If what the user pressed is the TAB key, read the TabNext property value of non-standard control A so, that is: ID-B, judge whether the ID-B designated control exists, the control criteria of right and wrong control B of ID-B appointment in the present embodiment, so, cursor will be moved to the control of ID-B appointment, promptly non-standard control B becomes current control; If the user supresses the key except that the TAB key, for example, supress TAB and shift key or other any key simultaneously, perhaps not by any key, so current control still is non-standard control A;

At this moment, we suppose that the user supresses the TAB key, and so current control is B,

That is, current control is:

<span?ID＝”ID-B”TabPrevious＝”ID-A”TabNext＝”ID-C”>

<input?type＝”text”name＝”name2”>

<input?type＝”hidden”name＝”name3”>

<input?type＝”radio”name＝”name4”>

＜/span〉time,

At this moment, if and then the user presses the TAB key again, so, obtain the TabNex t property value of non-standard control B, that is: ID-C, judge then whether the ID-C designated control exists, and has the control of ID-C appointment in the present embodiment, the control of ID-C appointment is non-standard control C, so, if the user supresses the TAB key again, cursor will move to the control of ID-C appointment so, and promptly non-standard control C becomes current control; When if this moment, the user pressed the TAB+Shift key simultaneously, obtain the TabPrevious property value of non-standard control B: ID-A, judge then whether the ID-A designated control exists, the control of ID-A appointment in the present embodiment is non-standard control A, so, when the user pressed the TAB+Shift key simultaneously, cursor moved on to non-standard control A, and promptly non-standard control A becomes current control; When the user presses the key except TAB and shift key or not by any key, current control still is non-standard control B;

Existing, we suppose that the user supresses the TAB key, and so current control is non-standard control C, that is, current control is:

<input?ID＝”ID-C”type＝”text”name＝”name5”TabPrevious＝”ID-B”>

After non-standard control C becomes current control, if the user supresses the TAB+Shfit key simultaneously, obtain the TabPrevious property value of non-standard control C so, that is: ID-B, whether the control of judging the ID-B appointment exists, the control of ID-B appointment in the present embodiment is non-standard control B, so cursor moves to the control of ID-B appointment, promptly non-standard control B will become current control; If the user does not press the TAB+Shfit key simultaneously, so current control still is non-standard control C.

Freely switching between the non-standard control and non-standard control in the webpage described in the above-mentioned specific embodiment, below we will further describe freely switching between non-standard control of webpage and the standard control in conjunction with concrete control code;

Specific embodiment two

With reference to Fig. 3, we define the code of relevant control:

<form?action＝/cgi-bin/post-query?method＝Post>

<input?type＝”text”name＝”name6”>

<input?ID＝”ID-A”type＝”text”name＝”name1”TabNext＝”ID-B”>

<input?type＝”text”name＝”name7”>

<span?ID＝”ID-B”TabPrevious＝”ID-A”TabNext＝”ID-C”>

<input?type＝”text”name＝”name2”>

<input?type＝”hidden”name＝”name3”>

<input?type＝”radio”name＝”name4”>

</span>

<input?ID＝”ID-C”type＝”text”name＝”name5”

TabPrevious＝”ID-B”>

<input?type＝”submit”>

<input?type＝”reset”>

</form>

In the present invention, we claim＜input type=" text " name=" name6 " be standard control D;

＜input type=" text " name=" name7 " be standard control E;

Other control is criteria of right and wrong control A, B, C (referring to the detailed description of one of specific embodiment) respectively.

In the present embodiment, we suppose that current control is: standard control D;

According to the key assignments that obtains, what the judgement user pressed is that key, if the user supresses the TAB key, then cursor is moved to non-standard control A, makes non-standard control A become current control; If the user supresses other key except that the TAB key or do not press any key, then current control still is standard control D (realization of relevant this step utilizes technology commonly known in the art to realize, therefore, does not describe in detail at this);

In this embodiment, we suppose that the user supresses the TAB key at this moment, so after the user presses the TAB key, current control becomes non-standard control A by standard control D, and then, if the user supresses the TAB key again, obtain the Tabnext property value of non-standard control A so, according to the definition of the TabNext=ID-B attribute of non-standard control A, current control becomes non-standard control B by non-standard control A; Here it should be explained that: though standard control E is immediately following the back at non-standard control A, but owing to defined Tabnext=ID-B among the non-standard control A, so after the user pressed the TAB key, current control became non-standard control B by non-standard control A, rather than standard control E; And then, if the user supresses the TAB+Shift key simultaneously, obtain the TabPrevious property value of non-standard control B so, that is: ID-A, definition according to the TabPrevious property value of non-standard control B moves to non-standard control A with cursor, makes non-standard control A become current control; If the key that the user presses is the TAB key, according to the TabNext=ID-C property value definition of non-standard control B, cursor is moved on the non-standard control C so, make non-standard control C become current control.

Specific embodiment three:

With reference to Fig. 4, in the present embodiment, we suppose that current control is non-standard grid control, and the four direction key on the definition keyboard is the directionkeys of the non-standard form of operation, but it is directionkeys that the present invention is not limited to the four direction key definition on the keyboard, those of ordinary skills know, can be directionkeys with other key definition on the keyboard also; Non-standard grid control specific code is:

<table?CustomTable＝”true”border＝”1”cellspacing＝”0”

cellpadding＝＝”0”>

<thead>

<tr>

<td?style＝”width:120”type＝”0”name＝”cinvname”></td>

＜td style=" width:120 " type=" 1 " name=" fquantity " title＜/td 〉

＜td style=" width:120 " type=" 2 " name=" fprice " unit price＜/td 〉

＜td style=" width:120 " type=" 2 " name=" fmoney " amount of money＜/td 〉

</tr>

</thead>

<tbody>

<tr>

</tr>

<tr>

</tr>

</tbody>

<tfoot>

<tr>

＜td align=" center " add up to＜/td 〉

</tr>

</tfoot>

</table>

In addition, data type with respect to each row in the above table: type=" 0 ", type=" 1 ", type=" and 2 " we also need define one corresponding to the input frame array A of each columns according to type, so that in self-defined form, add corresponding input frame; Array A is defined as follows:

Var itemAry=new Array (); !--definition unit lattice different types of data input frame array--}

!--forbidding input--}

itemAry[0]＝″″；

!--selection--}

itemAry[1]＝″<input?type＝′text′style＝′text-align:leftborder-right-width:0px；word-wrap:break-word；′>″

!--numeral--}

itemAry[2]＝″<input?type＝′text′style＝′text-align:right；word-wrap:break-word；′maxLeng?th＝16>″

Concrete grammar is as follows:

Step S401 obtains the CustomTable property value of non-standard grid control;

Step S402 judges whether the CuStomTable property value equals true;

Step S403, if the CustomTable property value is not equal to true, the current cell in the so self-defined form loses focus;

Step S403 is if the CustomTable property value equals true;

Step S404 obtains the key that the user presses;

Step S405 is if the user supresses directionkeys upwards;

Then,

Step S406 judges whether to exist the lastrow cell;

Step S407 if there is the lastrow cell, moves to cursor on the lastrow cell so, makes the lastrow cell become current cell;

Step S408, if there is no lastrow cell, cursor still rests on the current cell so;

Step S409 is if the user supresses downward directionkeys;

Then,

Step S410 judges whether to exist the next line cell;

Step S411 if there is the next line cell, moves to cursor on the next line cell so, makes the next line cell become current cell;

Step S412, if there is no next line cell, cursor still rests on the current cell so;

Step S413 is if the user supresses directionkeys left;

Then,

Step S414 judges whether the left side has cell;

Step S415, if there is cell in the left side, so on the cell that cursor is moved to left,

Make the cell on the left side become current cell;

Step S416, if there is not cell in the left side, cursor still rests on the current cell so;

Step S421, according to the type attribute of cell in the gauge outfit of current cell column, that is: by

＜td style=" width:120 " type=" 1 " name=" cinvname " title＜/td 〉

<td?style＝”width:120”type＝”300142”

Name=" fquantityy " quantity＜/td 〉

＜td style=" width:120 " type=" 310122 " name=" fprice " unit price＜/td 〉

＜td style=" width:120 " type=" 000140 " name=" fmoney " amount of money＜/td 〉

In the type property value of definition, obtain the data type of current cell column;

Step S422, according to the data type of current cell column, and the definition of above-mentioned array A, in current cell, add the input control of corresponding data type, that is, add corresponding input frame;

The user can fill in the data of corresponding data type in the input frame that adds;

When the user has filled in data, when cursor leaves current cell, the data content that the user filled in will be presented in the cell.

Though defined in the specific embodiments of the invention when the user presses the TAB key, obtain the TabNext property value of non-standard control, when the user presses TAB and TAB+Shift key simultaneously, obtain the TabPrevious property value of non-standard control, but, the present invention is not restricted to TAB described in the foregoing description and TAB+Shift key, and any key on those of ordinary skills' definable keyboard replaces TAB and TAB+Shift key.

The control of mentioning in the present invention comprises standard control and non-standard control.

Claims

1, a kind of method of freely switching between the webpage control of realizing is characterized in that, comprises the following steps:

Define the Custom Attributes of non-standard control;

Judge the key of being pressed by the user on the keyboard;

The key of pressing according to the user and the self-defining property value of non-standard control are determined next control;

And to make the next control that obtains be current control;

2, the method for freely switching between the realization webpage control according to claim 1, also comprise: according to the data type of current cell column, add the input control of corresponding data type, so that the user imports the data of corresponding data type in current cell, and when cursor left current cell, the data of being imported were presented in the current cell.

3, the method for freely switching between the realization webpage control according to claim 1 is characterized in that,

The Custom Attributes of described non-standard control comprises:

4, the method for freely switching between the realization webpage control according to claim 3 is characterized in that:

5, the method for freely switching between the realization webpage control according to claim 1 is characterized in that: described non-standard control is the control that non-standard input control maybe can be set to the current focus object.

According to the method for freely switching between the described realization webpage of claim 5 control, it is characterized in that 6, the key that described user presses comprises TAB key and TAB+Shift key.

7, the method for freely switching between the realization webpage control according to claim 5 is characterized in that described Custom Attributes comprises: TabNext attribute and TabPrevious attribute;

8, the method for freely switching between the realization webpage control according to claim 6 is characterized in that:

9, the method for freely switching between the realization webpage control according to claim 6 also comprises the following steps:

10, according to the method for freely switching between the realization webpage control according to claim 6, also comprise comprising the following steps: