JavaScript界面传值与前后台互调

话说曾在校时,前端的第一门课程HTML静态网页设计,其老师,真是应了他的名字: 路遥知马力。 整个学期硬是全部在 Dreamwear 中进行拖拽控件来教学,未曾教授一句代码。成功忽悠了全体学生,课上一本正经的胡说八道,对拖拽控件的心得侃侃而谈,想想也是讽刺,同期的学生都是纯手写编辑界面,我们却依旧沉浸在设计下的拖拽操作中,带来的就是界面看起来还像回事,只是源码惨不忍睹,后来有幸在网上观看了燕十八老师的HTML系列视频,犹如冬服参汤,醍醐灌顶。使我终没有在拖拽的路上越走越远。

1.前台界面互调传值,就是子界面与父界面之间的那些事

①父界面传值到子界面  opener方法来说获取父界面元素

    <script type="text/javascript">
        function getfather() {
            var a = window.opener.document.getElementById("txt1").value;
            var b = window.opener.document.getElementById("txt2").value;
            console.log(a);
            console.log(b);
        }

    </script>

如上图所示,txt1、txt2 为父界面中两个textbox 的 ID 属性值,这样就可以直接接受值,纯前台界面之间的操作

2. 函数执行顺序,对于一般按钮而言,可以设置 OnClick、OnClientClick、OnCommand事件,执行顺序如下:

①OnClientClick  调用JS中设置的方法

②OnClick 按钮单击事件,在OnClientClick 事件之后执行

③OnCommand 在OnClick 事件执行,一般是结合CommandName 属性一起使用,当界面上有多数按钮时,可以进行标记

3. 前台方法中设置判断,是否执行 OnClick 事件

 <script type="text/javascript">
     function Todu() {
         var txtbd = document.getElementById("txtbd").value;
         if(parseInt(txtbd)!=2) {
             alert("回答錯誤,無法進行進入後台");
             return false;     //添加此處
         }
         else {
             alert("我將要執行後台方法");
         }
     }
 </script>

默认情况下,OnClientClick  事件执行完,是要执行 OnClick 事件的,在前台做判断时, 需要设置两个地方,其一是在方法中添加,如上图注释处,其二如下图,在OnClientClick  事件中加入 return false();

<body>
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="lab" runat="server"></asp:Label>
        <br />
        <asp:TextBox ID="txtbd" runat="server"></asp:TextBox>
        <asp:Button ID="btn_to" runat="server"  Text="ToBaidu" OnClick="btn_to_Click" OnClientClick="Todu(); return false();"/>
    </div>
    </form>
</body>

4.后台调用前台方法

① 在Page_load 里面给某个按钮绑定前台方法 (注:和前端调用略有不同,false 后面没有括号)

       protected void Page_Load(object sender, EventArgs e)
       {
           btn_to.Attributes.Add("onclick", "javascript:return Todu(); return false;");
       }

② 在某个按钮事件或方法中 绑定前台方法

        protected void btn_id_Click(object sender, EventArgs e)
        {
            //在前台腳本裡面增加一個script: window.open(‘B.aspx‘);
            this.ClientScript.RegisterStartupScript(this.GetType(), "", "window.open(‘B.aspx‘)", true);
            //在前台腳本裡面增加一個script: icc();    注:沒有true
            this.ClientScript.RegisterStartupScript(this.GetType(), "", "<script>icc();</script>");
            //在前台腳本裡面增加一份script:    alert("123");   注:单/双引号
            Response.Write("<script type=‘text/javascript‘>alert(‘123‘);</script> ");

        }

5. 前台调用后台方法

        public int After()
        {
            return 233;
        }

        public int After2(int a, int b)
        {
            return a + b;

        }

比如后台有以上两个方法,一个带参数,一个不带参数,那么在前台的方法中,若调用后台方法,如下:

     function iafter() {
         var b = "<%=After()%>";
         alert(b);
     }

     function iafter2()
     {
         var b = "<%=After2(5,8)%>";
         alter(b);
     }
时间: 2024-10-20 05:18:54

JavaScript界面传值与前后台互调的相关文章

界面传值

属性传值 1.属性传值用于第一个界面向第二个界面传值 2.明确两者联系的桥梁,也就是触发跳转的地方 3.明确传输的值  类型是什么 4.在第二个视图控制器内部声明相对应类型的属性 来接收传输的值 5.在第二个界面使用传入的值 1.声明协议 UI中的协议为当前类名 + Delegate 2.  声明代理 3.代理对象执行协议 4.指定第二个界面的代理对象为自己 5.接收协议 6.实现协议中的方法

属性传值,协议传值,block传值,单例传值四种界面传值方式

一.属性传值 对于属性传值而言,相对于其它的三种 方法来说,是最基础,最简单的一种 方法,但,属性传值 有很大的局限性,因为是适用于第一个界面向第二个界面传 值,第二个向第三个界面传值等等.N界面向N + 1界面传值.而在此基础上,必须知道跳转界面的明确位置及所要传的值的具体类型.在第二个界面中声明所要传值 类型的属性. @interface SecondViewController : UIViewController //声明一个字符串属性来保存第一个界面传过来的字符串内容 @propert

iOS-跨界面传值和跨应用传值

跨界面传值 从一个界面将一个结果值传到另一个界面,这个是我们在开发过程中非常常见的一个问题.传值本身并不是一个太复杂的问题,在此主要简述一下常用的传值方法. 我们传值常用的方法主要有四种: 1.属性传值 2.代理传值 3.block传值 4.通知传值 属性传值: 属性传值应该来说是比较简单的一种传值方式,但是这种传值方式有其局限性,常用的一种场合是我们从界面A跳转到界面B,如何我们想讲界面A的值传到界面B,属性传值是比较方便的一种方式.如下图所示,如果我们点击A界面上的一个按钮,跳转到B界面,并

iOS UI08_TableView界面传值

实现两个界面之间内容的传递 // // MainViewController.m // UI08_TableView界面传值 // // Created by dllo on 15/8/7. // Copyright (c) 2015年 zhozhicheng. All rights reserved. // #import "MainViewController.h" #import "SecondViewController.h" @interface Main

界面传值,单例,模态

v 界面间传值场景 1.由前往后属性传值.在后一个界面中定义属性(属性类型和数据类型一致) 2.当push到下一个界面之前给属性赋值3.在下一个界面中,对应的控件从属性中获取数据 2. 由前往后 协议代理,1.在后一个界面定义协议(协议中定一个传值方法,方法由参数,参数类型和传输类型一致)2.在后一个界面定义代理属性,3.在前一个界面中设置代理4.代理对象的类服从协议 3.多界面传值(即可以从前往后,也可以从后往前) 单例一个类只有一个对象 1.新建一个单例类 2.添加便利构造器方法并且保证该方

iOS中block用法之两个界面传值问题

Block的使用有很多方面,其中传值只是它的一小部分,但是很常用更实用,下面介绍Block在两个界面之间的传值用法: 先说一下思想: 首先,创建两个视图控制器,在第一个视图控制器中创建一个Label和一个Button,其中Label是为了显示第二个视图控制器传过来的字符串, Button是为了push到第二个界面. 第二个界面的只创建一个TextField,是为了输入文字,当输入文字并且返回第一个界面的时候(第二个视图将要消失的时候),就将这个 TextFiled中的文字传给第一个界面并且显示在

iOS开发- 界面传值(1)-通知模式(广播)

之后的几篇博客, 记录下不同界面间传值的常用办法. 这篇文章记录广播的方式. iOS的设计模式中,通知模式也是其中重要的模式之一,Notification直译为通知,其实本人觉得叫做广播模式更为贴切.它的作用就是一个对象对多个对象的同步操作.用法很简单,一个对象发出一个广播,需要收听的听众就先注册一下,然后选定频道,完了就可以收听广播的内容了. 但是要注意一点, 在收听之前, 一定要先注册. 不然发送的广播接受不到, 也就是值改变了, 不会做出响应. 下面是一个简单的demo, 效果如下: 第一

iOS开发之不同界面传值

iOS开发中不可避免要用到不同界面传值,今天就总结下三种传值方法:闭包传值.代理传值和通知传值. 1.闭包传值 如图建立VC1和VC2,com+R运行正常~把VC2的button用Action关联并设置tag. 在VC2中定义一个闭包 var closures: ((clicked: NSString) -> Void)? 设置VC2中三个button的点击事件(这里三个button的tag设置为101,102,103) @IBAction func numBtn(sender: AnyObje

ios学习(界面传值的方法)

ios(学习)界面传值的方法 block: 实现界面传值的方法1.block: 实现界面传值,都是从第二个界面向第一个界面传值:第一种block 首先).在第二个界面secondViewController声明set方法 声明block @property (nonatomic,copy) void(^change)(UIColor *color); 其次).在.m文件实现 实现block的方法 _callback([UIColor redColor]);//注意这里之所以是_callback的