jQuery插件 distpicker实现多次赋值

项目里需要实现省市区联动选择功能，使用了一个jQuery插件dispicker，记录一下使用过程中遇到的问题和解决办法。

需要要实现的功能就两个：打开modal框时设置地址，点击重置按钮时重置地址

原本以为这是一个非常容易实现的功能，毕竟distpicker有自身赋值的方法，直接多次调用就好了嘛。结果，使用起来才发现自己真是too naive。

• 前台样式

• 调用插件的赋值方法

    $('#aChange_aDetail').distpicker({
        province: data.province,
        city: data.city,
        district: data.country
    });

问题就这么猝不及防的来了--同一个js文件里，distpicker的赋值方法只能使用一次！！也就是说我无法多次对distpicker进行赋值。
用到这里的我，尼克杨-头左下方三个小问号-右上方三个小问号.jpg

• 开始疯狂翻看文档和百度，伟大的互联网冲浪大佬们的解决办法是在初始化之前调用$().dispicker("destory)方法，即先对当前实例进行销毁

    $('#aChange_aDetail').dispicker("destory)
    $('#aChange_aDetail').distpicker({
        province: data.province,
        city: data.city,
        district: data.country,
        placeholder: false
    });

于是我满怀信心的任务问题已经被解决的时候，保存，刷新，开始操作
完全没用啊摔！

无奈只能开始暴力操作--你不让我改，我就删了你全家 ！！

• 写一个函数，在每次赋值之前将选择器全部删除在添加

    function distpickerReset() {
    var parent = $('#aChange_aDetail').parent('li');
    parent.find('#aChange_aDetail').remove();
    var dist =
        '' +
        '' +
        '' +
        '' +
        ''
    parent.append(dist)
    }

• 再在每次赋值前先调用重置函数

    distpickerReset()
    $('#aChange_aDetail').distpicker({
        ...
    })

保存，刷新，运行，完美解决

回头一下，我依稀觉得事情不会这么简单，可能是有更官方、更简洁、更高端的解决方法，我却没有发现，谁叫我只是个菜鸡呢

再回头看看自己的博客，短短的文字里飘荡着无数的表情包，我觉得自己可能不止是个菜鸡，还是个神经失常的菜鸡

毕竟菜，才是最纯粹的快乐