Nano Hash - криптовалюты, майнинг, программирование

JSFiddle JavaScript не работает в Dreamweaver

Я сделал небольшой проект для школы на JSFiddle, перенес код в Dreamweaver и он перестал работать. Вот мой код в JSFiddle в разделе HTML, так как это было единственное место, где он работал.

<table>
    <tr>
        <td>
            <p>
                <select name="metal" id="metal">
                    <option value="9CaratGold">9 Carat Gold.</option>
                    <option value="18CaratGold">18 Carat Gold.</option>
                    <option value="Silver">Silver.</option>
                    <option value="Platinum">Platinum.</option>
                </select>
            </p>
        </td>
        <td>
            <p>
                <select name="currency" id="currency">
                    <option value="GBP">GBP (£)</option>
                    <option value="EUR">EUR (€)</option>
                    <option value="USD">USD ($)</option>
                </select>
            </p>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            <input maxlength="6" type="number" name="weight" id="weight" style="width:185px;" value="Insert weight (g)">
        </td>
    </tr>
</table>
<table>
    <tr>
        <td>
            <input type="submit" class="calcButton" id="calcButton" onClick="calcPrices()" value="Get a Quote">
        </td>
    </tr>
</table>
<p id="quotation"></p>
<script type="text/javascript">
    var data;
    csv = "9 Carat Gold,18 Carat Gold,Silver,Platinum\n11.87,23.73,0.49,27.52",
    $(document).ready(function() {
        $.ajax({
            type: "POST",
            url: "/echo/html/",
            dataType: "text",
            data: {
                html: csv
            },
            success: function(data) {
                processData(data);
            }
        });
    });

    function processData(allText) {
        var allTextLines = allText.split(/\r\n|\n/);
        headers = allTextLines[0].split(',');
        lines = [];

        for (var i = 1; i < allTextLines.length; i++) {
            data = allTextLines[i].split(',');
            if (data.length == headers.length) {

                var tarr = [];
                for (var j = 0; j < headers.length; j++) {
                    tarr.push(headers[j] + ":" + data[j]);
                }
                lines.push(tarr);
            }
        }
    }

    function calcPrices() {

        var weight = document.getElementById('weight').value;
        var metal = document.getElementById('metal').value;
        var currency = document.getElementById('currency').value;
        var metalPrice;
        var totalPrice;
        var conversionRate;
        var conversionSymbol;

        if (metal === "9CaratGold") {
            metalPrice = data[0];
        }

        if (metal === "18CaratGold") {
            metalPrice = data[1];
        }

        if (metal === "Silver") {
            metalPrice = data[2];
        }

        if (metal === "Platinum") {
            metalPrice = data[3];
        }

        if (currency === "USD") {
            conversionRate = 1.57;
            conversionSymbol = "$";
        }

        if (currency === "EUR") {
            conversionRate = 1.23;
            conversionSymbol = "€";
        }

        if (currency === "GBP") {
            conversionRate = 1.00;
            conversionSymbol = "£";
        }

        totalPrice = ((metalPrice) * (conversionRate));
        totalPrice = ((totalPrice) * (weight));
        totalPrice = totalPrice.toFixed(2);
        if (weight <= 500 && weight >= 1) {
            document.getElementById("quotation").style.color = "black"
            document.getElementById("quotation").innerHTML = (('We can offer you ' + (conversionSymbol + totalPrice)) + ' for ' + weight + 'g.');
        } else {
            document.getElementById("quotation").style.color = "red"
            document.getElementById("quotation").innerHTML = "Please insert a weight between 500 and 1 gram.";
        }
    }
</script>

Вот JSFiddle для справки. http://jsfiddle.net/KieranOM/u3kxomaa/ В JSFiddle кнопка работает отлично; однако локально он ничего не делает при нажатии.

Вот некоторая ключевая информация. И в JSFiddle, и в Dreamweaver у меня включен jQuery 1.8.3. В JSFiddle я отключил onLoad и вместо этого изменил его на

без упаковки - в

Любая помощь в этом будет принята с благодарностью.


Ответы:


1

У вас есть сервер, настроенный на возврат данных, как это делают они?

url: "/echo/html/",

Это нужно подключить к вашей фактической серверной странице, которая возвращает значение...


Также вы не отменяете отправку формы нажатием кнопки. Верните false, чтобы остановить действие.

onClick="calcPrices(); return false"

Вы действительно не должны использовать встроенные события.

$("#calcButton").on("click, function(e) {
    e.preventDefault();
    calcPrices();
});   
16.12.2014
  • Не могли бы вы выделить то, на что вы ссылаетесь? Я не вижу формы в своем коде. Заранее спасибо :) РЕДАКТИРОВАТЬ: Извините за это, но я относительно новичок в том, как работает JSFiddle, не могли бы вы помочь мне исправить код для локальной работы? 17.12.2014
  • Вы не видите событие нажатия на кнопку? 17.12.2014
  • Я вижу событие, но я не был уверен, что вы имели в виду под формой. Первоначально я использовал функцию calcPrices() только вниз, но я ввел синтаксический анализ CSV, чтобы работать параллельно с ней. Первоначальная версия работала нормально, как и раньше, все в приведенном выше сценарии функции calcPrices() было добавлено недавно, поэтому я не слишком хорошо с ней знаком. 17.12.2014
  • Какую ошибку вы получаете? вы добавили возврат false? 17.12.2014
  • Я получаю две ошибки, одна с 'onClick=calcPrices();' а второй с 'metalPrice = data[0];' Они классифицируются по одной и той же ошибке: Uncaught TypeError: Cannot read property '0' of undefined Я также понял свою ошибку с URL-адресом: /echo/html/ и заменил его URL-адресом: metals.csv, а также удалив данные: { html: csv }, есть мысли, что делать дальше? ОБНОВЛЕНИЕ: XMLHttpRequest также не может загрузить файл:///X:XXX/XXX/metals.csv. Запросы между источниками поддерживаются только для схем протоколов: http, data, chrome-extension, https, chrome-extention-resource с jquery. 17.12.2014
  • Запросы между источниками поддерживаются только для схем протоколов: http. Это указывает на то, что вы запускаете страницу либо как c:/, либо как file:/, а не по протоколу http. Для этого вам понадобится работающий локальный/локальный сервер. 17.12.2014
  • @GVashist Большое вам спасибо, я чувствую себя таким идиотом после того, как перечитал ваш комментарий. Спасибо вам обоим за то, что помогли мне исправить это! Это честно очень ценится! Наконец-то я могу сдать свою курсовую работу по информатике! :D 17.12.2014
  • Новые материалы

    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..

    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..

    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..

    Как я автоматизирую тестирование с помощью Jest
    Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..

    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..

    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..

    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..