• legend2---开发日志6(后端和前端如何相互配合(比如php,js,元素状态和数据改变))


    legend2---开发日志6(后端和前端如何相互配合(比如php,js,元素状态和数据改变))

    一、总结

    一句话总结:php给元素初始状态,js根据这个状态做初始化和后续变化,使用vue真的很方便(php给vue数据就好,其它全交给vue了)

    vue特别好用 php给数据或者初始状态 js根据这个状态做初始化和后续变化

    1、一种可行的控制html元素状态的方式是什么(比如收藏按钮的收藏和未收藏状态)?

    元素加状态属性字段

    可以在元素上面加一个属性字段,状态改变,这个属性字段也改变,根据这个属性字段就可以知道当前元素状态

    比如题目的收藏与未收藏状态,php初始将这个状态给div,然后js根据这个状态来控制元素收藏与未收藏显示

    2、jquery 取消radio选中?

    removeAttr("checked") 
    attr("checked",false)
    $("#rdo1").removeAttr("checked");
    $("input:radio[name="analyshowtype"]").attr("checked",false);

    3、jquery如何获取所选的多个checkbox的值?

    :check找所有值 .each()遍历每个 .push()存值

    找到所在题目选中的checkbox,然后遍历,然后将结果push进数组即可

     1 <script>
     2     //【提交答案】逻辑
     3     $(function () {
     4         $('.submit_question').click(function () {
     5             //步骤一:获取参数
     6             let bq_id=$(this).attr('bq_id');
     7             console.log(bq_id);
     8             let question_index_num=$(this).attr('question_index_num');
     9             console.log(question_index_num);
    10             let question_num=parseInt(question_index_num)+1;
    11             console.log(question_num);
    12 
    13             //步骤二:获取用户答案
    14             //拼接多选框名字
    15             let checkbox_class="question_option_"+question_num;
    16             console.log(checkbox_class);
    17             var user_options=[];
    18             $("input."+checkbox_class+":checked").each(function () {
    19                 user_options.push($(this).val());
    20             });
    21             //let user_options=$("input[type=checkbox]:checked").val();
    22             console.log(user_options);
    23         });
    24     });
    25 </script>

    4、thinkphp获取全部类型(无论post,get方式等)的传入参数?

    Request::instance()->param()

    可以直接获取Request的param()即可获得全部参数

    dump(Request::instance()->param());
    dump(Request::instance());
      ["param":protected] => array(2) {
        ["/index/blog_do_question/submit_question_html"] => string(0) ""
        ["user_options"] => array(2) {
          [0] => string(1) "2"
          [1] => string(1) "4"
        }
      }
      ["get":protected] => array(1) {
        ["/index/blog_do_question/submit_question_html"] => string(0) ""
      }
      ["post":protected] => array(1) {
        ["user_options"] => array(2) {
          [0] => string(1) "2"
          [1] => string(1) "4"
        }
      }

    5、ajax为什么可以接受键值对和普通索引数组作为参数,而不能接受键值对数组成为参数?

    拼接到url 参数本质是键值对
    普通索引数组可化为键值对
    键值对数组无法和数组名化为键值对

    因为参数相当于是要拼接到url上,键值对参数好拼接,普通索引数组通过数组名和数组里的值也可以拼接为键值对,但是键值对组成的数组却不行,

    而且你看post提交的时候checkbox也是普通索引数组

    data Object,String

    发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。查看 processData 选项说明以禁止此自动转换。必须为 Key/Value 格式。如果为数组,jQuery 将自动为不同值对应同一个名称。如 {foo:["bar1", "bar2"]} 转换为 "&foo=bar1&foo=bar2"。

    6、php比较两个数组是否相等?

    == ===

    如何判断两个数组相等呢?其实很简单,用 == 或者 === 就可以了
    php手册里说明如下:

    那像 array('k'=>array())这样的多维数组能用如上方法判断相等吗?当然也可以。
    若数组是数字索引的,就要注意一下了,见代码:

    < ?php
    $a = array("apple", "banana");
    $b = array(1 => "banana", "0" => "apple");

    var_dump($a == $b); // bool(true)
    var_dump($a === $b); // bool(false)
    ?>

    除了==这种数组操作符之外,还有其他比较绕的方法来判断。比如说,利用array_diff($a, $b)来比较两个数组的差集,如果差集是空数组的话就相等了。

    7、移除iCheck选项控件的方法是什么?

    官方文档 使用手册 .iCheck('')

    自己完全可以不jquery乱试,直接去看官方文档和使用手册就好了

    1. $('input').iCheck('check');   //将输入框的状态设置为checked 
    2. $('input').iCheck('uncheck'); //移除 checked 状态 
    3. $('input').iCheck('toggle');  //toggle checked state 
    4. $('input').iCheck('disable'); //将输入框的状态设置为 disabled 
    5. $('input').iCheck('enable');  //移除 disabled 状态 
    6. $('input').iCheck('update');  //apply input changes, which were done outside the plugin 
    7. $('input').iCheck('destroy'); //移除iCheck样式

    8、js数组转字符串?

    array.join(',');
    var arr = [1,2,3,4,'巴德','merge'];
    var str = arr.join(',');
    console.log(str); // 1,2,3,4,巴德,merge

    9、view端用php来初始化元素(标签)的显示状态好么(比如答题页面)?

    不是很好  php给元素加状态 js根据状态做初始化和后续变化
    用vue做数据绑定

    其实不是很好,可以用php给元素加状态,然后用js来做初始化或者后续的变化显示

    其实也可以完全交给vue,这样会省很多事

    10、如何解决get方式请求题目列表时如果url中带上换题参数,那么页面跳出再跳回来(比如跳回博客园地址)都会自动换题?

    初始设置【允许换题参数】0   需要换题时ajax将【允许换题参数】置为1  【换题参数】结合【允许换题参数】才能换题  多次通信

    可以在缓存中设置$val['allow_change_question_list']=0;//默认不允许切换题目列表,要点【整轮切换】按钮才行,直接url不行

    然后需要切换题目的时候,先ajax把缓存中 'allow_change_question_list' 改为1

    页面切换题目不仅要有【换题参数】,还要有【允许换题参数】

    其实也就是多次通信

    二、内容在总结中

    1、相关知识

     

    2、代码

     
  • 相关阅读:
    马踏棋盘的贪心算法
    Windows Phone开发(13):如何规范用户的输入行为
    Windows Phone开发(16):样式和控件模板
    Windows Phone开发(18):变形金刚第九季——变换
    Windows Phone开发(10):常用控件(上)
    Windows Phone开发(14):数据模板
    Windows Phone开发(12):认识一下独具个性的磁贴
    Windows Phone开发(15):资源
    Windows Phone开发(11):常用控件(下)
    Windows Phone开发(17):URI映射
  • 原文地址:https://www.cnblogs.com/Renyi-Fan/p/10662546.html
Copyright © 2020-2023  润新知