Question

我是Javascript的新手。但我必须在我的一个项目中使用它。

我有一个标签式控件，用于设置页面上各种事件的隐藏控件的值（选项卡点击和下拉列表）。隐藏控件被提供一个JSON字符串，并单击一个按钮，执行一些服务器端代码并在页面控件中填充数据。

当我直接在隐藏输入的onchange事件中运行此代码时，行为与我提取Javascript并将其放入函数时的行为不同。

我需要将其拉出来，这样我就可以在函数中做一些其他一些小事情，这些事情似乎对onchagne事件中的内联代码很复杂。

以下是正常运行的代码。

<input type="hidden" id="<%= ASP_SSRS.ClientID %>_tracDatState" 
onchange="$('#<%= ASP_SSRS.ClientID %>').val(this.value); 
document.getElementById('<%= btnSendHiddenField.ClientID %>').click();" />

与此代码相比较。这有不同的影响。

<input type="hidden" id="<%= ASP_SSRS.ClientID %>_tracDatState" onchange="compareUnitValues(this.value)" />


    <script type ="text/javascript">
        function compareUnitValues(args) {
            $('#<%= ASP_SSRS.ClientID %>').val(args);               
            document.getElementById('<%= btnSendHiddenField.ClientID %>').click();
        }
    </script>

提前感谢任何见解。汤姆

Answer 1

好吧，让我们按部分打破它，我将假设ASP_SSRS在控件内，这就是为什么你有更多的开销。

直接致电：

$('#<%= ASP_SSRS.ClientID %>').val(this.value); 
document.getElementById('<%= btnSendHiddenField.ClientID %>').click();

你有正确的客户端元素...因为你把你的方法放在那条线上，你完全松开它们，换句话说，到ASP.NET渲染时您的新方法，它不知道ASP_SSRS和/或btnSendHiddenField。

唯一的办法就是将这些传递给自己的方法。

如果您将方法签名编写为：

function compareUnitValues(elmt, value1, value2)

然后你可以在里面请求他们的属性并分配你想要的任何值，所以让我们把它包起来：

<input type="hidden" id="<%= ASP_SSRS.ClientID %>_tracDatState" 
       onchange="compareUnitValues(this.id, '<%= ASP_SSRS.ClientID %>', '<%= btnSendHiddenField.ClientID %>');" />

这样，您将输入<%= ASP_SSRS.ClientID %>_tracDatState传递为this - ＆gt; this是触发方法的关联元素，在这种情况下，您在<%= ASP_SSRS.ClientID %>_tracDatState元素上调用方法。

在我们的情况下，只需传递ID 就可以轻松实现，我们会在编写javascript方法时看到它们！

<input type="hidden" id="<%= ASP_SSRS.ClientID %>_tracDatState" 
       onchange="compareValues('<%= ASP_SSRS.ClientID %>_tracDatState', '<%= ASP_SSRS.ClientID %>', '<%= btnSendHiddenField.ClientID %>');" />

你也传递了你想要操作的元素的正确元素id，就像那行一样，ASP.NET渲染引擎确切地知道帽子是ASP_SSRS和btnSendHiddenField

渲染后，您的方法调用将类似于：

onchange="compareValues('Ctrl001_ASP_SSRS_tracDatState', 'Ctrl001_ASP_SSRS', 'Ctrl001_btnSendHiddenField');"

和女巫这样的价值观，你现在可以做很多事情：

function compareUnitValues(elemt, value1, value2) {

     var state   = $("#" + elemt),
         ssrs    = $("#" + value1),
         btnSend = $("#" + value2);

     // assign state value to ssrs
     ssrs.val(state.val());

     // trigger the send button
     btnSend.trigger("click");
}

javascript onchange中的代码与函数中的相同代码有什么区别？

1 个答案: