2

我有一个 MultiDatesPicker 控件，用户可以在其中选择一些日期。一个 textarea 对象自动填充日期，而用户选择其中的一些。一切正常。我现在喜欢做的是，检查该 textarea 的长度，因此当长度 > 60 时将其宽度更改为 200px，而当 <=60 时宽度将为 90。我做了以下操作：

 <script type="text/javascript">
    $(document).ready(function () {
        $.datepicker.setDefaults($.datepicker.regional['el']);
        $('#cPublDates').multiDatesPicker({
            altField: '#tbPublishDates'
        });
        $(function () {
            $('#tbPublishDates').change(function () {
                alert('changed');
                if ($(this).val().length > 60) {
                    $(this).width(200);
                } else {
                    $(this).width(90);
                }
            });
        });
    });
</script>

并且对象是

        <div class="pulicationBox">
        <span id="cPublDates"></span>
        <asp:TextBox ID="tbPublishDates" runat="server" ClientIDMode="Static"  TextMode="MultiLine" Rows="5" Width="90px" />
    </div>

但没有工作，因为没有触发 change() 事件。#tbPublishDates 是文本区域的 id。由于我是 jQuery 的新手，因此欢迎任何想法或代码更正。

谢谢

4

3 回答 3

4

试试，现在动态绑定到文本框...

还要确保您已包含 jQuery 库版本 1.7 或更高版本

<script type="text/javascript">
$(document).ready(function () {
    $.datepicker.setDefaults($.datepicker.regional['el']);
    $('#cPublDates').multiDatesPicker({
        altField: '#tbPublishDates'
    });

        $('#tbPublishDates').on('change', function () {
            alert('changed');
            if ($(this).val().length > 60) {
                $(this).width(200);
            } else {
                $(this).width(90);
            }
        });
});

于 2012-09-07T06:43:17.783 回答
1

可能您的问题是因为它是向文本区域添加值的多日选择器，因此 jquery change() 不会触发。我建议您使用 multidatepicker 事件 onSelect() 来检查文本区域的长度。

<script type="text/javascript">
$(document).ready(function () {
$.datepicker.setDefaults($.datepicker.regional['el']);
$('#cPublDates').multiDatesPicker({
    altField: '#tbPublishDates',
    onSelect: function(){
        alert('changed');
        if ($('#tbPublishDates').val().length > 60) {
            $('#tbPublishDates').width(200);
        } else {
            $('#tbPublishDates').width(90);
        }

   }
});

});

请参阅http://multidatespickr.sourceforge.net/文档。

于 2012-09-07T07:38:41.527 回答
0

试试这个：

$('#tbPublishDates').change(function () {
        alert('changed');
        if ($(this).val().length > 60) {
            $(this).css('width','200');
        } else {
             $(this).css('width','90');
        }
    });
于 2012-09-07T06:47:16.063 回答